Tom Dell'Aringa wrote:
> Hi there,
>
> I have a dev site that firefox seems to be collapsing a bottom margin. I'm
> fairly sure it's because I have floats following one another. It works fine
> in IE. The clearfix doesn't seem to work. The page is here - the homepage:
>
> http://oapps.pixelmech.com/
>
> See the three buttons? Should be 12px of margin below. Again, works in IE6.
> The CSS:
>
> http://oapps.pixelmech.com/include/main.css
> I believe the pertinent items are:
>
> #box-container - container, floating left, a container for the light
> blue top section
> .box-wide - the content in that section is in here, floated left again
> #homebuttons - the three buttons are in here (they are block) - this
> is where the margin is specified but not being applied.
>
> Any help is appreciated! Tried various fixes with no luck. Please CC
> pixelmech at gee mail with any answers.
Hi Tom. Try adding padding-bottom: 12px to .box-wide, and deleting the
margin declaration on .box-wide #homebuttons:
.box-wide {
width: 685px;
margin-left: 20px;
padding: 0;
float: left;
display: inline; /* fix ie double margin */
padding-bottom: 12px; /*<--add this*/}
.box-wide #homebuttons {
padding-left: 70px;
margin: 12px 0; /*<--- delete this line*/ }
AC
--
Audra Coldiron
Rock-n-Roll Design & Hosting
http://rock-n-roll-design.com
KarmaCMS ( http://karmawizard.com ) - the ultimate CSS styled CMS.
Pre-made designs, designer tools, and reseller program available!
______________________________________________________________________
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/
