Jump to content

evening+equal div heights


joecoolaug
 Share

Recommended Posts

Hi joecoolaug,You can use "px" or "%" for height.Please check the code below. Believe this is what you want.I don't like "666666" so I used color Gray.Tested in only IE6 & Firefox.

<html><head><style type="text/css">div.container{width:100%;margin:0px;border:1px solid gray;line-height:105%;}div.header,div.footer{padding:0.5em;color:white;background-color:gray;clear:left;}h1.header{height:18px;padding:10;margin:0;}div.left{float:left;width:30%;height:80%;margin:0;padding:1em;}div.content{margin-left:30%;height:80%;border-left:1px solid gray;padding:1em;}</style></head><body><div class="container"><div class="header"><h1 class="header">BLAH</h1></div><div class="left"><h2>This is Left side</h2>BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH</div><div class="content"><h2>This is Right side (id: Content)</h2>BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH  BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH </div><div class="footer"><font size="1">© 2004-2006 joecoolaug inc.</font></div></div></body></html>

----------------------------------------------------------------Sometimes "float" code creates alignment problems in CSS.Hope this works for you.dorothy

Link to comment
Share on other sites

uhhhh... i'm perhaps the least to answer ur question because i'm just starting out with css.but perhaps u can try a repeat-y for your background-image for the main content, then use a matching background-color for your side menu.with that- no matter how much content u have- it will always look the same- perfect.

Link to comment
Share on other sites

well- 2day is ur lucky day. i was not looking 4 it. had some css bookmarks and was going thru them 2 find out something. came upon this site and immediately thought about ur question. it basically said what i was trying to say above. look at it here.best regardsDonna

Link to comment
Share on other sites

well- 2day is ur lucky day. i was not looking 4 it. had some css bookmarks and was going thru them 2 find out something. came upon this site and immediately thought about ur question. it basically said what i was trying to say above. look at it here.best regardsDonna
Thanks for that, it helped a little bit. I still can't figure out how to get it to work in Firefox after lots of testing. I think I am going to go with a different layout. Thanks for your help, though. :)
Link to comment
Share on other sites

Thanks for that, it helped a little bit. I still can't figure out how to get it to work in Firefox after lots of testing. I think I am going to go with a different layout. Thanks for your help, though. :)
well- dont give up just yet! ur problem may be in the other browser rather than firefox- but thats besides the point.here is a site that i think is great. dont let the site design design turn u off--> the content is fabulous. i'm almost sure you'll find your solution there.click here for itgood luck,Donna
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...