...

View Full Version : Height: 100 % ?



CaptainB
10-27-2007, 08:06 PM
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??

michael180
10-27-2007, 08:31 PM
Did you try-

* {
margin: 0;

padding: 0;
}

CaptainB
10-27-2007, 08:34 PM
Yes, I have that in my css as well (view source of the link provided).

michael180
10-27-2007, 09:01 PM
It may because you have padding:1%; for #tekst, and you do not for the #leftmenu, and #rightmenu?

CaptainB
10-27-2007, 09:05 PM
No, the padding does not affect it. There might be a problem somewhere else. I just can't seem to find it.

michael180
10-27-2007, 09:20 PM
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?

CaptainB
10-27-2007, 09:24 PM
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'?

michael180
10-27-2007, 09:52 PM
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,

CaptainB
10-28-2007, 12:10 AM
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.

michael180
10-28-2007, 03:19 AM
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.

CaptainB
10-28-2007, 12:38 PM
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 :)

CaptainB
10-28-2007, 01:24 PM
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)

jlhaslip
10-28-2007, 01:32 PM
body { background-color: #556677; }

CaptainB
10-28-2007, 01:51 PM
jlhaslip, you're my hero!

jlhaslip
10-28-2007, 02:19 PM
jlhaslip, you're my hero!

I suggest you raise your standards... :D

CaptainB
10-28-2007, 03:50 PM
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

abduraooft
10-28-2007, 03:54 PM
Why do we need a separate forum for "Geek News and Humors" ? ;)

jlhaslip
10-28-2007, 04:53 PM
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:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum