>Or be evil and put it in a table Of all the excellent suggestions, this is the one that actually works. I chose to wrap the UL in a one cell table, and problem solved. Of course it means putting all ULs in tables but yeah, what can you can say about such a bizarre behavior. The right flloat is also an excellent piece of lateral thinking! Ill use that too.
Cheers all Peter On Mon, Apr 27, 2009 at 6:32 PM, Andrew McMurtrie <[email protected]>wrote: > > Just to qualify that: the float left image will affect the position of your > text not the bullet point or the edge of the other elements like <p> or > <ul> > they will start from the edge of the page. Either add a padding-right to > your image or use margins on your text. If you don't have the boarders then > padding should be ok if you do have boarders or background colour you need > to use margin. Think that is how it works. Or be evil and put it in a table > (that is bound to excite some people) and your positioning woes will vanish > in a puff of none purest smoke. > > Andrew > > > -----Original Message----- > From: [email protected] [mailto:[email protected]] On Behalf > Of Andrew McMurtrie > Sent: Monday, 27 April 2009 6:16 p.m. > To: [email protected] > Subject: [phpug] Re: UL margin near floated image issue > > > Only margin will work to give you the indent you need with that left > floating element, padding won't do it. > > Andrew > -----Original Message----- > From: [email protected] [mailto:[email protected]] On Behalf > Of Dmitry Ruban > Sent: Monday, 27 April 2009 5:47 p.m. > To: [email protected] > Subject: [phpug] Re: UL margin near floated image issue > > > Hi Peter, > > Give some space to left floating div by adding "margin-left: 150px" to P > and UL elements. > > Peter S: > > Ok. I tried that and it helps ... a little, but still not right. This is > > really starting to look weird, probably a browser bug, but in both IE > > and firefox? I have updated the test page with colored borders and valid > > xhtml. > > http://farmworks.studiomadfish.com/test.html > > > > Any other ideas? > > > > The closest i can get to a sane solution is this (if they can live > > without indented lists): > > ul, li {margin:0; padding:0;} > > ul {list-style-position:inside;} > > > > Would another doctype help? > > > > Surely others have encountered this bizzzare behavior? Its not just ULs > > its any thing with margins or padding near floated elements. > > > > <Begins tearing hair> > > > > P. > > > > > > > > > > On Mon, Apr 27, 2009 at 8:05 AM, Rory Casey <[email protected] > > <mailto:[email protected]>> wrote: > > > > > > li { list-style-position:inside; } > > > > + add some margin to your img > > > > img { margin:1em; } > > > > Adding borders to your ul elements lets you see what's going on. > > > > On Mon, Apr 27, 2009 at 6:40 AM, Peter S <[email protected] > > <mailto:[email protected]>> wrote: > > > Thanks guys. The suggestion to add padding just pads the problem > > further > > > right. The suggestion to add clear='both' stops the wrap, which i > > want. The > > > suggestion to make the img into a block level element makes no > > difference, > > > and indeed the original problem page has it inside a div box. > > Incidentally > > > the problem is the same using <img align='left' src='ddff' /> > > > > > > So how exactly does one left float an image without problems like > > this? > > > > > > Peter > > > > > > > > > On Sat, Apr 25, 2009 at 7:54 AM, .: christian mazur :. > > <[email protected] <mailto:[email protected]>> > > > wrote: > > >> > > >> Hi! > > >> Add "padding-right: n px" on your img tag. > > >> > > >> Ex. > > >> <img style="float: left; padding-right:30px;" > > >> src="http://farmworks.studiomadfish.com/images/soil_ss1.jpg"/> > > >> > > >> ch.- > > >> > > >> > > >> 2009/4/24 Peter S <[email protected] > <mailto:[email protected]>>: > > >> > Ive been doing mysql/php/html/css for a while, and > > occassionally noticed > > >> > odd > > >> > margin behavior around floated elements, but this UL oddity > > has finally > > >> > made > > >> > me ask whats going on... > > >> > > > >> > The problem is distilled down to a few lines here: > > >> > > > >> > http://farmworks.studiomadfish.com/test.html > > >> > > > >> > But ive also seen things like <hr>s run the full page width > > through a > > >> > floated element. > > >> > > > >> > Appreciate any pointers, thanks alot. > > >> > > > >> > Peter > > >> > > > >> > > > >> > > > >> > > > > >> > > > >> > > >> > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > __________ Information from ESET NOD32 Antivirus, version of virus > signature > database 4035 (20090425) __________ > > The message was checked by ESET NOD32 Antivirus. > > http://www.eset.com > > > > __________ Information from ESET NOD32 Antivirus, version of virus > signature > database 4035 (20090425) __________ > > The message was checked by ESET NOD32 Antivirus. > > http://www.eset.com > > > > > > > __________ Information from ESET NOD32 Antivirus, version of virus > signature > database 4035 (20090425) __________ > > The message was checked by ESET NOD32 Antivirus. > > http://www.eset.com > > > > __________ Information from ESET NOD32 Antivirus, version of virus > signature > database 4035 (20090425) __________ > > The message was checked by ESET NOD32 Antivirus. > > http://www.eset.com > > > > > > --~--~---------~--~----~------------~-------~--~----~ NZ PHP Users Group: http://groups.google.com/group/nzphpug To post, send email to [email protected] To unsubscribe, send email to [email protected] -~----------~----~----~----~------~----~------~--~---
![http://farmworks.studiomadfish.com/images/soil_ss1.jpg"/](http://farmworks.studiomadfish.com/images/soil_ss1.jpg"/){kind=link}