HTML
<!DOCTYPE html>
<html>
<head>
<title> My Blog </title>
<link rel="stylesheet" type="text/css" href="blogstyle.css">
</head>
<body>
<div id="container">
<div id="header">
<h1> Big Ass Machine</h1>
</div>
<div id="nav">
<ul>
<li>Home</li>
<li>About</li>
<li>IDK</li>
</ul>
</div>
<div id="main">
<div id="main_left">Article
<p class="tester">
This is a third entry for the blog.
Feb 23,2016
</p>
<p class="tester">
This is a third entry for the blog.
Mar 1, 2016
</p>
<p class="tester">
This is a third entry for the blog.
Mar 3, 2016
</p>
<p class="tester">
This is a third entry for the blog.
</p>
</div>
<div id="main_right">Sidebar
</div>
</div>
<footer>4 Footer
</footer>
</div>
</body>
</html>
CSS
#container
{
width:900px;
margin:0 auto;
overflow:auto;
}
#header
{
height:90px;
border:solid 2px #006600
}
#nav
{
overflow:auto;
border:solid 2px #006699;
margin-top:3px;
}
#nav ul
{
list-style:none;
height:30px;
padding:0px;
margin:0px;
}
#nav ul li
{
float:left;
margin:10px;
}
#main
{
overflow:auto;
margin-top:3px;
}
#main_left
{
float:left;
width:580px;
min-height:400px;
border:solid 2px #006600;
background-color:#32cd32;
}
#main_right
{
float:right;
width:300px;
border:solid 2px #006600;
background-color:#ffffcc;
min-height:400px;
}
footer
{
height:40px;
border:solid 2px #FF9900;
margin-top:3px;
}
img{
max-width:50%;
max-height:50%;
text-align:center;
}
p.tester{
font-size: 15px;
padding-top: 10px;
padding-left:10px;
padding-bottom: 10px;
background-image: url(file:///C:/Users/ccs11312h-11/Downloads/BG1test.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
{
width:900px;
margin:0 auto;
overflow:auto;
}
#header
{
height:90px;
border:solid 2px #006600
}
#nav
{
overflow:auto;
border:solid 2px #006699;
margin-top:3px;
}
#nav ul
{
list-style:none;
height:30px;
padding:0px;
margin:0px;
}
#nav ul li
{
float:left;
margin:10px;
}
#main
{
overflow:auto;
margin-top:3px;
}
#main_left
{
float:left;
width:580px;
min-height:400px;
border:solid 2px #006600;
background-color:#32cd32;
}
#main_right
{
float:right;
width:300px;
border:solid 2px #006600;
background-color:#ffffcc;
min-height:400px;
}
footer
{
height:40px;
border:solid 2px #FF9900;
margin-top:3px;
}
img{
max-width:50%;
max-height:50%;
text-align:center;
}
p.tester{
font-size: 15px;
padding-top: 10px;
padding-left:10px;
padding-bottom: 10px;
background-image: url(file:///C:/Users/ccs11312h-11/Downloads/BG1test.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
No comments:
Post a Comment