PDA

View Full Version : How to wrap content in container for bckgrnd colour?


Abbica
09-23-2010, 10:30 AM
Hi, Need advice. I have a container that holds my content but when I go to insert a background colour to the whole container it only allows me to change the colour of the top part of the container holding the logo and the tel numbers etc. Can anyone look at the code and possibly tell me what I did wrong, why my whole container won't change colour please, this is driving me mental and I cannot figure out what I did wrong, probably something to do with my insertion of my spry vertical widget?
Here is the code:-

<body>
<div id="container"><br />
<br />
<img src="../Images/logo.gif" alt="cliftonlogo" width="217" height="51" hspace="25" />
<p id="CompDetails"><span id="ContactH1">Merrion Squre,
<br />
Dublin 2.
<br />
<br />
Tel: <span class="style20" id="Contacth2"> +353 1 660 3587 </span><br />
Fax: <span id="Contacth2">+353 1 660 3588</span> <br />
Email: <span id="Contacth2">info@company.com</span></span><br />
</p>
<p><br />
</p>
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">Serviced Offices</a> </li>
<li><a href="#">Virtual Offices</a></li>
<li><a href="#">Business Support</a> </li>
<li><a href="#" class="MenuBarItemSubmenu">Premises</a>
<ul>
</ul>
</li>
<li><a href="#">Location</a></li>
<li><a href="#">Contact Us </a></li>
</ul>
<!-- TemplateBeginEditable name="SideBar" -->
<p class="homequote" id="SideLogo"><br />
<br />
<br />
<br />
"At these premises<br />
we pride ourselves <br />
on providing our clients with a <br />
full spectrum of professional services and facilities"<br />
<br />
<br />
<br />
<br />
<img src="../Images/company_letters2.gif" width="150" height="299" alt="Letters" /><br />
<br />
<br />
<br />
</p>
<!-- TemplateEndEditable --><!-- TemplateBeginEditable name="body" -->
<div id="body"> <br />
<p class="imageContainer"><img src="../Images/images/Properties.jpg" alt="Properties" width="570" height="251" /></p>
<p><span class="style20 style23">Serviced Offices </span><span class="style22"></span><br />
<br />
<span class="bodytext">With more than forty individual offices, we can provide your company with as much, or as little, office accommodation as you need.<br />
<br />
All offices are fully equipped with essential office furniture. However, should you already have your own furniture there is no need to pay additional storage costs - subject to arrangement we can provide an empty office. Minimum stay is just three months. <br />
<br />
The following services are <strong>INCLUDED</strong> in the monthly VAT Free rental charge:<br />
<br />
Professional Reception Service (Mon - Fri 8.30am - 5.00pm) <br />
Telephone answering and message taking (Mon - Fri 8.30am - 5.00pm) <br />
Preferential access to our Business Support Services<br />
Private Mailbox for each company<br />
Essential Office furniture <br />
Telephone and facsimile numbers for use on letter heads/business cards<br />
24 hour 7 day access<br />
Monitored Alarm<br />
All Utility costs - including light, heat and power sockets<br />
Dublin Corporation Rates <br />
Property Insurance<br />
Shared kitchenette facilities<br />
Daily Cleaning (Mon - Fri)<br />
In-house Janitorial Services for general Maintenance<br />
Water cooler </span><br />
<br />
<br />
<br />
</p>
<p><span id="footer">| <a href="../SiteMap.html" class="linkcolour">SITE MAP</a> | <a href="../Contact_Us.html" class="linkcolour">CONTACT US</a> | </span><br />
</p>
</div>
<!-- TemplateEndEditable --></div>

d a v e
09-23-2010, 12:08 PM
post a link to the site - there's no css there or anything

Abbica
09-23-2010, 12:38 PM
I can't, I don't have it up but here is some of the relevant CSs if this helps, hopefully this helps a bit. When I inserted the spry horizontal I just returned down under the logo and company details and inserted it. Is this wrong?

#container {
vertical-align: middle;
width: 800px;
margin-right: auto;
margin-left: auto;
position: relative;
background-repeat: repeat-x;
background-color: #FFFFFF;
background-image: url(Images/GradientA.png);
}
}
#CompDetails {
float: right;
width: 203px;
position: absolute;
top: 16px;
right: 29px;
height: 96px;
}
}
.imageContainer {
padding: 0px;
float: none;
width: 570px;
position: relative;
margin: 0px;
clear: both;
}
}
#leftbar {
float: left;
width: 160px;
position: absolute;
top: 88px;
margin-left: 22px;
margin-top: 100px;
height: 3px;
left: 3px;
}
#body {
width: 570px;
margin-left: 200px;
position: relative;
bottom: 0px;
float: right;
clear: right;
margin-right: 28px;
background-repeat: repeat-x;
background-color: #FFF;
}
}
#footer {
padding: 0px;
margin-bottom: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #800000;
font-weight: bold;
margin-left: 140px;
}

d a v e
09-23-2010, 04:32 PM
well publish it to a test folder