All geek questions in one place

How to set a fixed height for my entire web page?

I thought this was a simple fix:

body { height: 1054px; } html { height: 1054px; }

Wouldn't that set a maximum page height of 1054px ? I also tried these workarounds, but they didn’t work with what I wanted:

 html { overflow: hidden; } <body><table id = "myTable"><tr><td> ..... </tr></td></body> #myTable { height: 100%; }

How to set absolute height for a web page? I'm also more interested in why body and html height calls won't work. I make many calls to position: relative , will this affect it?

+6
source share
3 answers

width and height set the absolute width and height of the element, respectively. max-width , max-height , min-width and min-height are separate properties.

Example of a page with 1054px square content and full background:

 html { min-width: 100%; min-height: 100%; background-image: url(http://www.example.com/somelargeimage.jpg); background-position: top center; background-color: #000; } body { width: 1054px; height: 1054px; background-color: #FFF; }

However, since you seem to be a table style (urgh), it would probably be much wiser to set the table height to 1054px and let the body automatically adjust itself to cover the whole table. (Keep the html style suggested above).

+11
source
Good question. I'm not sure, but have you tried to use one <div> (or <section> ) inside the <body> and set width , height and overflow: hidden ? Browsers can give special treatment for <html> and <body> .
+2
source

Have you tried setting the CSS CSS field to 0? Otherwise, there will be a certain amount (depending on the browser) of the field, which is included in the height (and width) of the page, but is not controlled by the height style;

In CSS:

 body: { margin: 0; }

IN jQuery:

 $('body').css('margin', 0);
0
source

Source: https://habr.com/ru/post/887834/

More articles:


All Articles