Right I have been trying to do a very simple page in CSS for hours and hours now and I have drawn blood on my nuckles and pulled hair out!
This will be hard to explain but I will do my best. From tutorials books I have read etc I believe I should be able to have a main container on a page (which keeps it central etc) and then have a container inside this ( content container for instance) which I can float things such as text boxes to the left and right etc. No matter what I do the "content container" will not inherit any heights etc of anything which is "floated" inside it (well it does in IE but not in FF) can someone please help me through this problem im really really at my wits end and thinking tables were so much easier!
Firstly Page Code
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=utf-8" />
<title>Untitled Document</title>
<link href="omstyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="Container">
<div class="banner"></div>
<div class="menu">
<div class="menutext"><div align="right">About Us Our Services Contact</div></div></div>
<div class="building"><img src="Images/building.png" width="317" height="307" /></div>
<div class="content">
<div class="tagline">
<div align="center">The “One Stop” service of gathering & compiling all documentation
required on new build construction</div>
</div>
<div class="textbox1">
<p>The O&M Bureau provides a “One Stop” service of gathering & compiling all documentation required on new build construction. From conception to completion, The O&M Bureau’s professional aggregation of documents via liaising with subcontractors, collating and arranging it in a readable, standard format and delivering it in hard copy (paper) or electronic output. This includes certification, safety data, cleaning information, product literature, record drawings & design criteria that will be delivered in hard copy, on disc or via an online portal. The team at The O&M Bureau has completed over 600 projects to date for most of the UK principal contractors (& many building owners). The project team are informed of progress throughout the project via site meetings & regular updates from our office based co-ordinators and online Tracking System (PITS).</p>
</div>
<div class="textbox2">
<p>Over the last 6 years, our team of professionals have produced O&M Manuals for the following Companies.</p>
<p> </p>
<div class="bulletone">
<ul>
<li>Wates</li>
<li>Carrillion</li>
<li>McAlpine</li>
<li>Skanska</li>
<li>Millers</li>
<li>GB Solutions</li>
<li>Galliford Try</li>
<li>Wilmot Dixon</li>
<li>Kier</li>
<li>ROK</li>
<li>ISG</li>
<li>Morgan Ashurst</li>
<li>BAM</li>
</ul>
</div>
<div class="bulletone">
<ul>
<li>Pochins</li>
<li>Mansells</li>
<li>Ocon</li>
<li>Rydon</li>
<li>Costains</li>
<li>Hammerson</li>
<li>HBG</li>
<li>Blue Jelly</li>
<li>Gilmac</li>
<li>Warings</li>
<li>Aspire</li>
<li>Logic</li>
<li>Midas</li>
</ul>
</div>
<div class="bulletone"><ul>
<li>Thistle Construction</li>
<li>Faithdean</li>
<li>Barnfield Construction</li>
<li>Stradform</li>
<li>Fitzpatrick</li>
<li>Gardiner & Theobald</li>
<li>Bowmer & Kirkland</li>
<li>Morgan Lovell</li>
<li>Macfarlanes</li>
<li>Norwest Holst</li>
<li>Kiley Construction</li>
<li>Shepherd Construction</li>
<li>Rackham Construction</li></ul>
</div>
</br></br>
</div>
<img src="Images/business_man.jpg" style="float:right; margin-top:35px; margin-right:35px;" />
</div>
</div>
</div>
<div class="Addressline">dvsvsd vdsvsdvsd sdsdv sv s dvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv s dvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv sdvsvsd vdsvsdvsd sdsdv sv s</div>
</body>
</html>
and css code
Code:
@charset "utf-8";
* {margin: 0; padding: 0; border: 0; outline: 0;}
body {
font-family: Tahoma;
font-size: 14px;
background-color: #FFFFFF;
margin:0px;
}
li {list-style:inside}
.Container{ position:relative; margin-left: auto; margin-right: auto; width:931px; text-align: left; background-color:#ffffff; }
.banner{width:931px; height:223px; background-image: url(Images/OM_HEADER_03.jpg); }
.menu{ width:698px; height:40px; float:right; background-image: url(Images/OM_menu_05_06.jpg); }
.menutext{ margin-right:30px; }
.building{ position:absolute; left:0px; top:235px; height:319px; width:307px; z-index:200; }
.content{width:931px; background-color:#bacded; margin-top:60px; border:1px solid #bbb5b5; margin-bottom:60px;}
.tagline{ width: 520px; float:right; padding:10px; margin-right:35px;}
.textbox1{width: 520px; float:right; background-color:#c5d7f4; border:1px solid #bbb5b5; padding:10px; margin-right:35px; }
.textbox2{width: 560px; float:left; background-color:#c5d7f4; border:1px solid #bbb5b5; padding:10px; margin-left:35px; margin-top:35px; }
.bulletone{width: 160px; float:left; margin-left:10px; }
.Addressline{margin-left: auto; margin-right: auto; width:931px; background-color:#bacded; border:1px solid #bbb5b5; clear:both; margin-top:5px;}
The site can be viewed at
http://www.actioncomputing.co.uk/ACTIONOM/
If someone could try and explain to me what im doing wrong so I can put a end to my problems maybe with a little theory I would be very gratefull.
Before you post, read our: 
