Stuart King wrote:
> If I have a 2 column layout with a footer.
>
> The content background is 780px by 412px.
>
> How do I make sure that the content div is the same dimensions, even with
> little content (I want the entire background to show)
>
> example:
>
> http://www.triviumwine.com/continuum_site/pages/vision.html
>
> Underneath this - how do I place the footer.
>
> thank you.
>
1/ Backup your entire current CSS for the above page in case you need to
go back to it.
2/ Replace your entire current CSS for the above page with this:
html, body {
margin : 0;
padding : 0;
}
body {
background-color : #fff;
color : #493415;
font : 100%/1.8 Verdana, Arial, Helvetica, sans-serif;
text-align : center;
}
#outerWrapper #contentWrapper {
overflow : hidden;
border : 1px solid red;
}
* html #outerWrapper #contentWrapper {
overflow : visible;
border : 1px solid red;
} /*for ie/6*/
img {
display : block;
}
h1 {
color : #960711;
font-size : 120%;
font-weight : normal;
line-height : 1.8;
letter-spacing : 0.4em;
}
h2 {
color : #960711;
font-size : 100%;
line-height : 1.8;
letter-spacing : 0.4em;
margin : 0;
}
p {
font-size : 90%;
font-family : "Times New Roman", Times, serif;
font-style : italic;
line-height : 1.8;
text-align : center;
}
a:link {
font-size : 75%;
color : #a88243;
}
a:visited {
color : #a88243;
}
a:hover {
color : #000000;
}
a:active {
color : #960711;
}
.psanserif {
color : #960711;
text-align : center;
font-style : normal;
letter-spacing : 0.2em;
}
#leftColumn1 ul {
list-style-type : none;
margin : 0;
padding : 0;
}
#leftColumn1 li a {
display : block;
color : #f9f2c7;
padding : 4px 0 4px 2px;
width : 145px;
font-size : 80%;
}
#leftColumn1 li a:hover, #leftcol li a:focus {
background-color : #6f5020;
color : #e3d7a5;
}
#leftColumn1 a#current {
background-color : #694c1e;
color : #f9f2c7;
}
#botmenu {
text-align : center;
margin : 50px 0 0 0;
font-size : 75%;
color : #a88243;
}
#outerWrapper {
margin : 50px auto 0 auto;
text-align : center;
width : 780px;
background : url(../images/cont_bk.jpg);
}
#outerWrapper #contentWrapper #leftColumn1 {
float : left;
padding : 24px 0 0;
width : 148px;
}
#outerWrapper #contentWrapper #content {
margin : 0 0 0 148px;
padding : 10px 24px 10px 24px;
}
table {
font-size : 75%;
text-align : center;
}
#outerWrapper #footer {
background-color : red;
clear : both;
}
*Note* that this was done live in the Firefox Web Developer Toolbar
thing tand that it has not been checked.
Is this /any/ close to what you have in mind?
When you reply, please reply to the list as well as me.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
