Footer not playing nice - content overflows

I’m not sure why this is happening, as I’m taking the overall design from another site I designed just last week. I’m redesigning this whole site (updating code also).

http://www.fibromyalgia411.info
http://www.fibromyalgia411.info/sitestyle.css

For some reason, the content of the footer div wants to overflow … and the whole area does not want to expand when more content is added.

When I do the padding for within the footer div … it pushes the disclaimer paragraph to the right. But if I take off the right and left padding, the text on both sides to right to the edge of the area.

At the time of writing this point, the HTML and CSS validate.

I know I’m missing the obvious, but after fiddling for over 2 hours … I think it’s best not to waste anymore time and just ask someone else.

Thanks in advance in helping to restore my sanity. :wink:

Hi,
Padding adds to the total width of an element. You must account for it on your width. :wink:


[B]#footer[/B] {
clear: both;
[COLOR=Blue]width: 930px;/*950px total with padding*/[/COLOR]
padding: 8px 10px 8px 10px; 
border-top: 1px solid #000000;
[COLOR=Red]/*margin-left: auto;
margin-right: auto;*/[/COLOR]
}

You can loose those auto margins since the footer is nested in the main wrapping div.

Rayzur,

Thank you so VERY much! I knew it had to be something obvious - it typically is. Your help has certainly been much appreciated! :cool: