Spacing in between content and copyright, HELP

+1 Robert Summers · October 5, 2014
I need a spacing gap in between the copyright and the content
What needs altering on how on adding here, please help

HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example</title>
<meta http-equiv="Content-Type" type="text/html" charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="main.css"/>
</head>
<body>
<header id="the_header">
<!--<img id="the_img" src="images/logo.png" width="120" height="120"/>-->
<h1>Welcome to My Website</h1>
</header>
<nav id="the_nav">
<a href="home.html">Home</a>
<a href="about.html">About</a>
<a href="contact.html">Contact</a>
</nav>
<section id="main_content">
<div id="art">
<article>
<header>
<hgroup>
<h2>Hey look here stupid!</h2>
<h3>Please read me, Its here what I am for?</h3>
</hgroup>
</header>
<p>This is my story. The cat sat on the mat. The end!</p>
<footer>
<p>- written by Quentin Watt</p>
</footer>
</article>
<br/>
<article>
<header>
<hgroup>
<h2>Hey look here handsome</h2>
<h3>Please read me</h3>
</hgroup>
</header>
<p>Story Time</p>
<footer>
<p>- written by Quentin Watt</p>
</footer>
</article>
</div>
</section>

<aside id="the_news">
<h2>Recent news!</h2>
add me on twitter @QuentinWatt
</aside>

<footer id="the_footer">
Copyright Robert Summers 2014
</footer>

</body>
</html>



CSS

*{
margin:0px;
padding:0px;
}
body{
display:block;
}
h1{
margin:20px;
padding:30px;
border: 2px solid blue;
font: bold 26px Tahoma;
}
#the_nav{
margin:20px;
padding:5px;
border: 2px solid red;
}
#the_nav a{
padding: 10px;
margin: 5px;
font:bold 14px Tahoma;
}
#main_content{
float:left;
border: 2px solid green;
margin-left:20px;
width:400px;
}
#art{
padding: 10px;
font-family:Tahoma;
}
#the_news{
float:right;
border: 2px solid yellow;
margin: 5px;
padding: 20px;
width: 150px;
text-align:right;
font: bold 14px Tahoma;
}
#the_footer{
clear:both;
padding:20px;
border: 2px solid black;
padding:10px;
margin:20px;
text-align:center;
}


Post a Reply

Replies

Oldest  Newest  Rating
0 Ray LeDuc · October 5, 2014
Hey Robert, 

     After further review of your code I noticed that on the main content area you only allowed for a 20px margin on the left side where as you might have used the following:

margin: 20px; 

thus allowing you to have marginal space all around your content area.


Good luck and keep coding you will get there :)

Ray LeDuc
0 Robert Summers · October 5, 2014
Thank you for your help

Kind regards 
Robert
  • 1

HTML / CSS / Web Design

128,009 followers
About

Discuss, share, ask, learn and teach HTML5 and CSS3.

Links
Moderators