PDA

View Full Version : Width issue


ViolaineA
01-18-2011, 03:29 PM
Hello,

I'm creating web pages with .twoColLiqLtHdr template.
My header is an image and I have problem with applying the same width to the Maincontent so that the text won't go further the header and the Footer.
you find the page in attachement
Here's the CSS code :

@charset "utf-8";
body {
font: 100% Sony Sketch EF;
background: #FFFFFF;
margin: 0;
padding: 0;
text-align: center;
}
.twoColLiqLtHdr #container {
width: 1030px;
background: #FFFFFF;
margin: auto auto;
text-align: left;
color: #006db0;
}
.twoColLiqLtHdr #header {
background: #FFFFFF;
}
.twoColLiqLtHdr #header h1 {
margin: 0;
padding: 5px 5px;
color:006699;

}

.twoColLiqLtHdr #sidebar1 {
float: left;
width: 168px; /* since this element is floated, a width must be given */
background: #FFFFFF;
padding: 50px 0px;
height:100%;
min-height: 100%;
}
.twoColLiqLtHdr #sidebar1 h3, .twoColLiqLtHdr #sidebar1 p {
margin-left: 02px;
margin-right: 02px;
text-align:left;
}

{
margin: 05px 0 0 18%;
height:100%; min-height: 100%;
width:70%;
}
.twoColLiqLtHdr #mainContent h1{
text-align:left;
padding-bottom: 0;
margin-bottom:0;

}
.twoColLiqLtHdr #footer {
padding: 0 0;
background:#DDDDDD;
}
.twoColLiqLtHdr #footer p {
margin: 0;
padding: 10px 0;
}

/* Miscellaneous classes for reuse */
.fltrt {
float: right;
margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
float: left;
margin-right: 8px;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
Thanks a lot for your help !:-D

DWcourse
01-18-2011, 04:37 PM
You should probably be using a fixed width layout.