Good day to all.
Did the following:

<body style="margin:0; padding:0px; background-image: url('images/bg_for_pages.jpg'); border: solid 1px #FF0000;">

And I saw that the body tag does not end at max. Browser height (FireFox), but by content. Those. It does not fill the entire browser window. How is this possible?

Even the height parameter: 100%; did not correct the situation.

    2 answers 2

    @I_CaR , for this to work, all ancestors of the selected tag must be given a height.

     html, body { height: 100%; }

    View example ( body tag is dimmed in gray)

    • The ancestor of the body is just one - html? I generally for the tag to which to screw the parameters can not be considered or when. But I did according to your version, it did not help. I also noticed that this is if body {border: solid 1px # FF0000; background: #ffffdd ;; } then the border ends before the square of the browser window itself in height, but its fill is triggered 100% in height. a working example can be seen here: icar.bget.ru/view.php?id=98 where the lower penumbra transition ends before the page. - I_CaR
    • --- PS Thank you, your thought hit the exit. He took off the gradient background with the body and hung it on html. - I_CaR
    • Web programming is 2 + 2 = (it all depends on the browser and its version). - I_CaR

    For html min-height is set: 100% and position: relative; For body - if necessary, to be only the height of the window - height: 100%. If you need to drag and lower for html, then min-height too: 100%

     html { position:relative; min-height: 100%; } body { height:100%; }