Jump to content

height setting


Recommended Posts

SOLVED-The problem has been solved thanks for the help.Need help, I am in the middle of a lot of projects, I am having a lot of fun, but I encountered a small problem.I have set a header, stretched it wide 100%, put a logo picture(the name of the site), and a picture of what he wanted. Ok now, I was trying to, I can't show a url because it's not live. Now what I want to do is have a 3 column layout, this is his master homepage, it will have a bunch of stuff linked to 3 drawers, with a bunch of mouse events to do some popping in and out. What i want is to have the header, all the way across the top, the two images are set and everything, it's done, now I have 3 columns, left, middle, right, each with a different background color, background image, and pictures. I need them to equally take up a section of the screen, I tried width:33% for all 3 of them, and then I tried setting height:100% for all 3 of them but it didn't work, I need each section to take up an equal part of the page, and I need all 3 to extend to the bottom of the page, I don't want to take the chance of setting it in pixels, because if I do, then if he uses that as a template later, with more content, and a scroll bar appears on the side, then the background will cut out, early. I need it to always go to the bottom of the screen, and if you scroll down, then it will either stretch with it or whatever, here is what i Have, you can copy this into a file and preview in browser, you won't see the pics, but you will get an idea of what I am wanting to do.

body{padding:0px;margin:0px;}#header{width:100%;height:120px;background-color:#000000;background-image:url(indexPgImagesEtc/ShelfMolding.jpg);background-position:bottom;background-repeat:no-repeat;}#logo{margin-left:300px;margin-top:50px;}#left{height:auto;width:33%;background-color:#000000;}#middle{height:auto;width:33%;background-color:#7B7B7B;}#right{height:auto;width:33%;background-color:#FFFFFF}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><link rel="stylesheet" type="text/css" href="huttonio.css" /><title>Huttonio Brooks: Furniture, Photographic Works, Sculpture and Fine Art Works, etc</title></head><body><div id="header"><img src="indexPgImagesEtc/HBlogoSm.jpg" alt="Name Logo" id="logo" /></div><div id="left"></div><div id="middle"></div><div id="right"></div></body></html>

Any advice or guidance would be greatly appreciated.

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
×
×
  • Create New...