DIV background behind Float image problem

[askari]

Hi, I have a div with text that wraps around a floated image but the problem is that the background behind the text doesnt float along with the text. I want it to resize correctly whether there is an image there or not (as the text currenly does)
Here is the test page:

http://www.defenderofrock.com/test.html

Thanks!

 

[Foamcow]

Add this to your stylesheet

hr {
    clear:both;
    visibility:hidden;
}

Then put a <hr> element after your text (outside the paragraph).

If you need to use <hr> tags elsewhere (and see them) then apply a class to the one used for clearing floats.



Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK

 

[glenmac]

Hmm found a wierd behavior using this code. When the page first loads it doesn't show the text, but if you resize the window the text shows up using IE6. I just did as Foamcow suggested. Any ideas as to why?

http://www.lantzvillecomputers.com/testing.htm

Glen

http://lantzvillecomputers.com

 

[Foamcow]

I don't see that behaviour I'm afraid.

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK

 

[askari]

Thanks guys,
I may not have explained the problem well enough... check the test page again & you will see what I mean (Ive used good old tables to illustrate how I want it to look)

http://www.defenderofrock.com/test.html

glenmac I see the bug you described Im using IE6

 

[Foamcow]

If you apply a right hand margin (say 150px) to the .background class you should achieve what you want.

I'm not sure you're constructing what you want in the right way though, but that kind of depends on the context of what the whole page is like.

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK