problem clearing floats..

[chbrandt]

I am having a slight problem clearing my floats and making the text on my website appear correctly in both Mozilla and Internet Explorer.

http://www.audiadesign.com/site.htm

I used the following code to attempt to clear floats and fix the problem:

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

I then added class="clearfix" to my container that is floating as you can see, and the problems are still happening. Any ideas? Thanks

Chris

[ronaldb66]

What seems to be the problem? I only have IE6.0 available and didn't see any glaring errors.

[Excavator]

Hello chbrandt,
I didn't look at it in IE6 but it does need a little work to look right in IE7 and FF.
-In each of your #who, #design and #quote divs you have an extra divs with no id that you are not styling. Get rid of the extra divs.
-In your footer, your misusing a ul.
-Style switcher not working.

Check the validator to fix the rest of the problems.

[edit] actually, it looks right in IE7 right now.

[chbrandt]

ok...the ul is one of the problems I was overlooking...thanks

I originally made it look right in Firefox but then it didnt look right in IE so I changed it to look right in IE just messing around and I can't figure out how to make it look right in both. I think there is something wrong with the floats clearing but that doesn't seem to be something I know how to fix. I'll get rid of the div's and see if that will fix it and if not I'll post again. Thanks

Chris

[_Aerospace_Eng_]

Well fix your coding errors first.
See them here.

[Excavator]

After you fix your errors, if you're still having trouble clearing floats (I don't think that's the problem in this case) there is a much easier way. Look at this page.