hey there,
I havbe the following html and css files:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
	<link rel=StyleSheet href="style.css" type="text/css">
	<title>My site</title>
</head>

<body>

	<div id="con">
		<div id="navigation">
			<ul>
				<li><a href="http://gagi.zxq.net/star.html">About me</a></li>
				<li><a href="http://gagi.zxq.net/ekes.html">Blog</a></li>
				<li><a href="http://gagi.zxq.net/mbretereshat.html">Links</a></li>
				<li><a href="http://gagi.zxq.net/bouncingball.html">News</a></li>
			</ul>
		</div>

		<hr>


		<div id="main">
			<h1>This is a sample article</h1>

				<p> Just some stuff to help me in building my first page.
					I intend to have a nice site, and I will have it. Just some stuff to help me in building my first page.
					I intend to have a nice site, and I will have it.
		</div>

		<div id="right">
			<p> Just some stuff to help me in building my first page.
					I intend to have a nice site, and I will have it.
		</div>

		<hr>





		<div id="foot">	
			<p>Running since 2011Running since 2011Running since 2011Running since 2011Running since 2011Running since 2011Running since 2011Running since 2011Running since 2011</p>
		</div>

	</div>

</body>


</html>

and my css file is:

#navigation{
	font-size: 100%;
	width: 800px;
}

#navigation ul {
	list-style: none;
	margin: auto;
	padding: 0;
	padding-top: 0;
}

#navigation li {
	margin-top: 0.0em;
	margin-bottom: 0.0em;
	display: inline;

}

#navigation a:link, #navigation a:visited {
	margin-right: 0.2em;
	padding: 0.0em 0.6em 0.0em 0.6em;
	color: #A62020;
	background-color: #FCE6EA;
	text-decoration: none;
	border-top: 1px solid #FFFFFF;
	border-left: 1px solid #FFFFFF;
	border-bottom: 1px solid #717171;
	border-right: 1px solid #717171;
}

#navigation a:hover {
	border-top: 1px solid #FFFFFF;
	border-left: 1px solid #FFFFFF;
	border-bottom: 1px solid #717171;
	border-right: 1px solid #717171;
}

#con {
	width: 800px;
}

#main {
	width: 80%;
	float: left;
	background-color: #FAEFEF;
}

#right {
	width: 20%;
	float: right;
	background-color: #eeeee1;
}

#foot {
	float: left;
}

the problem is that only the first horizontal rule appears on my browser. the <hr> between my 'right' and 'foot' divs won't appeat. anyone, please?

It does appear, to the right below #right. To place it below #main, give it a clear:both style.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.