-1

I have a body tag which has a background image.

the css properties of it is as follows :

body {
  background-image: url(image-url);
  background-size: cover;
  background-repeat: no-repeat;
}

Currently the page is not scrollable.

Let's say that image has height more than 100vh is there a way to make body extend to the height of the image without there being any content inside the body tag.

UVic
  • 1,671
  • 3
  • 14
  • 21
  • 1
    I think this can solve your problem https://stackoverflow.com/questions/600743/how-to-get-div-height-to-auto-adjust-to-background-size – Akhi Akl Jan 08 '20 at 10:15
  • 1
    Does this answer your question? [How to get div height to auto-adjust to background size?](https://stackoverflow.com/questions/600743/how-to-get-div-height-to-auto-adjust-to-background-size) – Anurag Srivastava Jan 08 '20 at 10:16
  • As far as I know, you can only scroll if the content of your body is high/wide enough to exceed the dimensions of the display. But background is not content. If you want it to make a simili-background, insert it as an image and add other elements in a `div` located in a layer above the picture's one. See the `z-index` (https://developer.mozilla.org/fr/docs/Web/CSS/z-index) property – Elie Ker Arno Jan 08 '20 at 10:29

1 Answers1

1

You cant scroll, because the body has no content. Try to put an invsibile image into the body. Like so:

<body style="background-image: url(your-image.jpg);">
 <img src="your-image.jpg" style="visibility: hidden;" />
</body>