CODEWITHSUNDEEP
htmlcss
user2154508
user2154508

Reputation: 345

Can I use the height of one div to implement the height of another?

Well, I tried to put a div in 100% height. I read some tutorials and I made this:

html {
    height: 100%;
}

body{
    padding:0px;
    margin:0px;
    height:100%;
    position:relative;
}

And it's going well. The div that I wanted changed to 100% height, but the scroll bar appears. And this is because I have a menu div. If I don't have this menu div, my other div is going to be 100% height with no scroll bars.

The question is: How do I "ignore" the sizes (height) of the menu so that the scroll bars don't appear? Maybe I should use the "clear:" field?

Upvotes: 0

Views: 70

Answers (3)

Kevin Lynch
Kevin Lynch

Reputation: 24723

You should set it to min-height to avoid scroll bars

html {
   min-height: 100%;
}

body{
    padding:0px;
    margin:0px;
    min-height: 100%;
    position:relative;
}

Upvotes: 0

Simon Boudrias
Simon Boudrias

Reputation: 44629

As long a the menu is in the page flow, his height won't be ignored.

What you may want to do though, is using absolute or fixed positioning on the menu so it hoes out and your main element take all height without being pushed down by the menu.

Upvotes: 0

user2019515
user2019515

Reputation: 4503

If you want to disable scrollbars you should use:

overflow:hidden;

Upvotes: 1

Related Questions