Premetto che mi sono da poco affacciato al mondo sui fogli di stile e subito, come prevedibile, sn incappato in qualche problema, lo espongo:

ho creato questa pagina

<style type="text/css">
<!--
body {
font:80% verdana,helvetica,sans-serif;
margin:0; padding:0
}
code { font:80% verdana,helvetica,sans-serif; display:block; margin:0 1em .5em 1em; }
hr { display:none }

/* centrare la pagina web a larghezza fissa */
body { text-align:center }
#header { width:98%; margin:1em auto; text-align:center }

#corpo { width:98%; margin:1em auto; text-align:left }
#footer { width:98%; margin:1em auto; text-align:center }

/* header */
#header {
background:#eee;
border:1px solid #000;
padding:1em 0;
}

#line { margin-top: 20px; border-top: 1px dotted #000; }


/* corpo */
#corpo {
background:#ccc;
border:1px solid #000;
padding:1em 0;
}

/*footer */
#footer {
background:#eee;
border:1px solid #000;
padding:1em 0;
}
-->
</style>

***********************

<body>


<div id="header">
<code>www.miosito.com</code>
<code>line</code>


<hr />


<div id="corpo">
<code>#corpo { width:90%; margin:1em auto; text-align:left }</code>
<code>#corpo {
background:#ccc;
border:1px solid #000;
padding:1em 0;
}</code>
</div>


<hr />


<div id="footer">
<code>line</code>
<code>link A | link B | link C | link D | link E </code>
<code>line</code>
</div>


</body>

vorrei che al posto di "line" ci fosse una bella linea orizzontale rimanendo inserita nell'"header" ma anche utilizzabile nel "footer" ... COME FARE?