Hi John,
It seems to be a 'clearing floats' issue.
Try add the following:
# wrapper {
overflow: auto;
width: 100%
...others actual rules...
}
I suggest you the following links:
http://annevankesteren.nl/2005/03/clearing-floats
http://www.456bereastreet.com/archive/200502/efficient_css_with_shorthand_properties/
Regards
Maurício Samy Silva
http://www.maujor.com/
----- Original Message -----
From: "John Moynihan" <[EMAIL PROTECTED]>
To: "'CSS'" <[email protected]>
Sent: Monday, April 02, 2007 9:18 PM
Subject: [css-d] Some trouble with Wrapper Div
> Hi Everyone,
>
> I am working on a site and it utilizes a wrapper as a container for the
> sites divs. I am having trouble with the wrapper following the length of
> the
> website. In other words some pages have longer content areas than others
> and
> on some pages the wrapper has cut off the content are with the content
> running longer than the wrapper. When I preview the site in IE it looks
> good
> but when I try to preview it in Firefox or Opera it looks terrible.
>
>
>
> I was wondering if the group could help me out with some advise on how to
> correct the wrapper problem so that it scales in size based on the length
> of
> the content area. I have used the following CSS code on the site:
>
>
>
> .wrapper {
>
> background-color: #FFFFFF;
>
> width: 767px;
>
> margin-top: 0px;
>
> margin-right: auto;
>
> margin-left: auto;
>
> padding: 4px 5px 0px;
>
> left: auto;
>
> right: auto;
>
> border: 1px solid #333333;
>
> height: 100%;
>
> }
>
> .content {
>
> font-family: Arial, Helvetica, sans-serif;
>
> font-size: 11pt;
>
> font-weight: normal;
>
> color: #333333;
>
> background-color: #FFFFFF;
>
> width: 540px;
>
> height: 100%;
>
> margin-top: 7px;
>
> padding-top: 5px;
>
> padding-right: 7px;
>
> padding-bottom: 5px;
>
> padding-left: 7px;
>
> text-align: left;
>
> float: right;
>
> }
>
> .footer {
>
> font-family: Arial, Helvetica, sans-serif;
>
> font-size: 9pt;
>
> color: #666666;
>
> background-color: #FFFFFF;
>
> width: 99%;
>
> left: auto;
>
> right: auto;
>
> bottom: 0px;
>
> top: 800px;
>
> border-top-width: 1px;
>
> border-top-style: solid;
>
> border-top-color: #666666;
>
> font-weight: normal;
>
> text-decoration: none;
>
> position: static;
>
> padding-bottom: 8px;
>
> }
>
>
>
> Thanks for any help with this matter.
>
>
>
> - John
>
>
>
>
>
>
>
>
>
>
> ______________________________________________________________________
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7 information -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
