Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
[solved] i'm stuck here... having problems with floats in IE.
ok, normally i can handle the numerous IE glitches quite well but this time i’m stuck. i’m having some “media boxes” in my article and want the text to float around it. a “media box” contains of an image plus caption / or link to open a gallery, etc.
this box has the following properties:
.entrySingle .pulledImage {
width: 425px;
display: block;
float: right;
margin: 13px 13px 13px 26px;
padding: 2px 0 0 0 ;
background-color: #161616;
}
the containing element is called #leftCol and has a width specified. i don’t see why IE doesn’t let the text wrap around the image… if anyone came across such a situation before, any help would be greatly appreciated!
you can see the problem over here (works as intended in FF, safari, etc — doesn’t float in IE6/7)
Last edited by sthmtc (2007-09-27 22:00:09)
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
remove display: block;, it wont work in IE with floats, if it float beside other block-elemnents (divs, paragraphs). Only values “all” and “inline” will work in that case. But if that block-value is needed for something, it must have be wraped inside element that has display: inline;float:right;-attribute.
Cheers!
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
thanks for having a look, jukka. i’ve tried that before, but unfortunately it doesn’t have any effect here. display is now set to inline but the problem persists..
Last edited by sthmtc (2007-09-27 21:07:00)
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
The solution is that you are forcing your paragraphs to have a width. You have this in your css:
.entrySingle p {
padding: 0 0 13px 0;
width: 425px;
}
#news .entrySingle p {
padding: 0 0 13px 0;
width: 498px;
}
Remove the widths and hey presto!
And .pulledImage doesn’t need to have display:inline
Ed
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
ah.. thanks edward!
that’s indeed the problem. now i’m going to have to find a way to apply the width in a different manner as the text shouldn’t extend to the full width of the column so that the images are sticking out a bit to the right..
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
maybe add some padding to the div which holds all the content and then a negative margin to the div which holds the image so that it moves into the padding.
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
or even simpler, why not make .entrySingle p and #news .entrySingle p have some padding-right?
Offline
Re: [solved] i'm stuck here... having problems with floats in IE.
ricetxp wrote:
or even simpler, why not make .entrySingle p and #news .entrySingle p have some padding-right?
d’oh! of course, that’s it! thank you so much, it’s such a big help sometimes to have someone with a “fresh eye” looking over your code…
Offline