works in Safari, not FF??

[azzcat]

Thanks in advance for anyone willing to help over the holiday weekend!

Please visit my test page http://www.azzcatdesign.com/azzcatdevel … fault.html to view HTML and CSS. The document validates strict. Doesn’t validate CSS (using rounded corners and "sticky footer". That wouldn’t bother me except…

#1) Content will not wrap around floated images in FF, Opera or IE7. This is destined to be converted to WordPress (at which I’m still quite new). But if I can’t get it working in static HTML, I don’t want to go to WP yet.

#2) Opera doesn’t honor my sticky footer. Though, honestly, this is a minor issue at present.

I’ve tried everything I can think of/find…overflow:auto, overflow:hidden, changed up div widths, even some magic incantations…I’m at my wit’s end! I’ve never had this issue with floated images in paragraph text???

Any and all suggestions are appreciated!

[AshtonSanders]

"azzcat" wrote:

#1) Content will not wrap around floated images in FF, Opera or IE7.

I’m pretty confused by this… Try updating this class:

Code:

.post img.floatLeft {
float:left;
margin:0 10px 10px 0;
}

Text won’t wrap unless you tell the image to float to a side. ;)

Fun design btw.

[azzcat]

Thanks, Ashton!

Seems my .floatLeft style got ignored or overridden. If I added float:left or :right to the .post it’s all good.

Funny how Safari found and used the common style further down, but FF and others did not.

Still can’t figure out about the footer problem.

[AshtonSanders]

Well, I installed Opera for you, and I see the large space…

It looks to be 180px, which just happens to be the same as 2x 90px:

Code:

#wrapper
{ *snip*
padding-bottom: 90px; /* must be same height as the footer <-- This one */ } #footer { *snip* height: 90px; margin-top: -90px; /* negative value of footer height <-- This one */ *snip* }

I’d assume that two of those 90s are causing it. Have you tried removing these on some of them and see what happens?
I recommend trying the two that i put " <– This one " next to. I don’t get the purpose of those two lines. They obviously make the space, then put the footer in that space, but why? Just don’t make any space, and leave the footer where it is…

Let me know

[Author]

Posts