Help with "Build a Resume". HTML Lesson 7


#1



I don't now why:

a) LEFT section is below FOOTER section
b) Text size in the Header don't change never.


HTML Section:


<!DOCTYPE html>
<html>
	<head>
		<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
		<title></title>
	</head>
	<body>
	<div id="header">
	    <h3>Header</h3>
	</div>
	<div class="right">
	    <p>Right
	       <li>Hello</li>
	    </p>
	</div>
	<div id="footer">
	    <p>Footer</p>
	</div>
	<div class="left">
	    <p>Left</p>
	</div>
	</body>
</html>



CCS CODE:


div {
    border-radius:5px;
}
  
#header {
    z-index:1;
    position:fixed;
    margin-top:-2px;
    margin-bottom:15px;
    height:50px;
    width: 97%;
    background-color:#668284;
    font-family:Arial
    Font-size: 50px;
    text-align:center
    
    }   
    
.left {
    Position:relative;
    float:left;
    margin-top:55px;
    padding-top:40px;
    padding-left:10px;
    padding-bottom: 40px;
    height:500px;
    width:8%;
    background-color:#B9D7D9;
    margin-bottom:15px;
    }
  
.right {
    Position:relative;
    float:right;
    margin-top:55px;
    padding-top:40px;
    padding-left:10px;
    padding-bottom: 40px;
    height:500px;
    width:88%;
    background-color:#F4EBC3;
    margin-bottom:7px;
    margin-right:19px;
    
    }

    
#footer {
    Position:relative;
    height:50px;
    background-color:#668284;
    clear:both;
    text-align:center;
    font-family:Courier;
    Font-size: 20px;
    padding-top:0.1px;

    
    }

Check the result CLIC HERE


#2
  1. because your left is below your footer in the html code, order in html code is important.
  2. seems the h3 default font-size overwrites the font-size you specify in header, try to overwrite the heading font-size inside the header (#header h3 is the css selector you need)

#3

@stetim94 thank you :slight_smile:
Yes, order was important :wink:

http://screencast.com/t/txEPNXtWojAj