CSS Headaches again!

uk_viper

uk_viper

uk_viper

Soldato
Joined
30 Jun 2003
Posts
2,807
Location
Berkshire
In the middle of doing a simply site layout but getting a few problems with my css

#left is meant to be a left column
#right is meant to be a right column

on the page result one comes underneath the other, can anyone tell me where im going wrong?

help greatly appreciated

Code: 
body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#000000}
a:link { text-decoration:none; color:#000000 }
a:visited { text-decoration:none }
a:hover { text-decoration:underline }
a:active { text-decoration:none }

#container { width:700px; height:580px; border-color:#000000; border-width:1px; border-style:solid; margin:auto; }
#header { background:#003366 url(images/logo.jpg) no-repeat left; height:60px; text-align:right; color:#FFFFFF; font-size:11px}
#header a:link { text-decoration:none; color:#FFFFFF }
#menu { background-color:#003366; text-align:center; color:#FFFFFF; padding-bottom:5px;}
#menu a:link { text-decoration:none; color:#FFFFFF }
#left { width:200px; height:405px; float:left; background-color:#003366; color:#ffffff; padding: 0px 0px 0px 0px; overflow:auto; position:absolute; }
#right { width:500px; height:405px; float:right; background-color:#003366; color:#ffffff; padding: 0px 0px 0px 0px; position:absolute; }
#left-title { font-weight:bold; color:#FFFFFF; text-decoration:underline; font-size:14px; padding-bottom:10px;}
#footer { height:100px; width:700px; background-color:#FFFFFF; border-color:#000000; border-style:solid; border-width:1px; margin:0px auto; clear:both;}
 
Heres the HTML code, had to remove content details for certain reasons

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Title</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="container">

<div id="header">
[i]CONTACT TEL AND EMAIL HERE[/i]

</div>

<div id="menu">
[i]MENU HERE[/i]

<div id="left">
<div id="left-title">Home</div>
section used for short form news in file news-text.php

<div id="right"></div>


<div id="footer">
[i]COMPANY CONTACT DETAILS HERE[/i]<br />

</div>

</div>
</body>
</html>
 
You must log in or register to reply here.
Back
Top Bottom