Build a resume


#1

I wondered if someone could look at my code. Im having problems with the ".right div" it doesn't seem to be sitting in the centre of the page..

header {position:fixed;

z-index:1;

background-color:#383a35;
height:50px;
width:100%;
border-color:5px dashed red;
border-radius:5px;
padding:5px 5px 5px 5px;

}

.left {background-color:#ffde6b;
height:100%;
width:100px;
border-color:5px solid blue;
border-radius:5px;
float:left;
}
.right {background-color:#67a0e1;
height:450px;
width:100%;
border-color:5px solid blue;
border-radius:5px;
float:right;
}

footer {background-color:#383a35;

height:50px;
width:100%;
border-color:5px dashed red;
border-radius:5px;
padding:5px 5px 5px 5px;
clear:both

}


#2

it is in the center of the page, there is just a white space around due to body's margin. I am so confused by this code, your .right is 100% width, this means, .left and .right will never float beside each other (not enough space). If you use percentage for height (like in your .left) make sure all parents (body, html) also have a height (100% preferable) since percentage height inherits from it's parent (a div with height: 50%; is half the height of it's parent)


#3

so in that case would it be easier to set the width/height etc to px?


#4

height? yes i would. But you can perfectly find use percentage, just make sure html and body have a height:

html, body { height: 100%; }

Or you can give body a px height. It is just (i had this problem) with the code you had, some parents of .left had 0 height, 100% of 0 = 0, so your .left wont show. keep in mind that now 100% of you .left is equal to your html document height (so your screen height - the browser bar)