Height: 100 % ?

Hi!

If you look at this site: http://www.behrentzs.com/sites/webtjenesten/design2.php

the height of the 2 sidebars is not 100%. I tried to set that in the css, but with no result. Here's my css for the 2 colums and the main row:
Also, the content isn't stretching 100% of the site. If you look at the most outer right side, you will see some white space. How to correct it?

#leftmenu { width:14%;
height:100%;
background-color:#567;
float:left;
border-right:1px solid black;
font-size:9px;
}

#rightmenu { width:14%;
height:100%;
background-color:#567;
float:left;
border-left:1px solid black;
font-size:9px;
}

#tekst { width:69%;
background-color:#fff;
border-top:1px solid #000;
padding:1%;
float:left;
font-size:9px;
}

Can anybody give me a hint on what to do??

Did you try-

* {
margin: 0;

padding: 0;
}

Yes, I have that in my css as well (view source of the link provided).

It may because you have padding:1%; for #tekst, and you do not for the #leftmenu, and #rightmenu?

No, the padding does not affect it. There might be a problem somewhere else. I just can't seem to find it.

I think you might try to remove the padding in #tekst, it worked for me.

See http://www.moderntimes.com/tmp_3/

That is if you want all three cols to align?

I tried to remove it, however no difference in the height. I also can't see no difference in the height in your example.

I want the 2 columns in the sides to go all the way to the bottom of the browser, no matter how big the resolution is. I just can't make em'?

I did not fully understand your question. The height property is calculated with respect to the height of the containing block. If you want to extend the rt, and lf, cols to infinity you might want to make them part of a background image.

You might want to check this out.

http://www.alistapart.com/articles/fauxcolumns/

Good luck,

Ah, that seems like a pretty good and easy solution.
However I'm using percent (%) for widths and heights on this design, so how would I make an image that fits? Cause' when using percent for that kind of properties, the width and height isn't exactly the same on different resolutions I guess.

I would avoid using %'s, you know how wide your cols need to be. Those dims will hold regardless of monitor resolution. The only problem you might run into is that if the viewer to your site increases the type size in his browser, and that none of us can control. Give it a try.

Okay, I tried it, however it didn't work out as intended, mainly because I didn't think before I asked.

So, here goes: How would I make all my columns stretch to the hight of the browser, and expand when more content is added? I found this: http://www.communitymx.com/content/article.cfm?cid=BAD95

However with the technique descriped, I can only make it work in IE6, so that all the columns will be 100 % height - they won't expand more when more content is added.

I know my question is a little confusing, but I hope you understand anyways :)

Or wait! I've made it work in IE6 with the technique desribed in Michael's link. However it only works in IE6.

http://www.behrentzs.com/sites/webtjenesten/design2.php

Anybody got a clue on how to fix it for FF too? (css in view source of the page)

body { background-color: #556677; }

jlhaslip, you're my hero!

jlhaslip, you're my hero!

I suggest you raise your standards... :D

LOL! I know what you mean, haha! But I have the excuse that I have thought about it all the day, so my brain wasn't fit for fight.. or something like that :D

Why do we need a separate forum for "Geek News and Humors" ? ;)

Why do we need a separate forum for "Geek News and Humors" ? ;)
Humour? No room for Humour in a Coding Forum... serious stuff only... :eek: