Ari,

On Dec 14, 2005, at 8:19 PM, Ari Davidow wrote:

>
>> On Dec 14, 2005, at 6:18 PM, [EMAIL PROTECTED] wrote:
>
>> http://dev.jwa.org/discover/oralhistory/guide.html
>
>
>>>>> I seem to be having an unexpected amount of trouble wrapping a list
>>>>> around
>>>>> an image.
>>
>> Strange as it may seme, the ul extends under the floated image, so 
>> any left margin on the ul is masked by the book.  To prove this to 
>> yourself, set a background-color on the ul.  To get the look you're 
>> after, move the margin/padding to the li like so.
>>
>> ul {
>>         margin: 0;
>>         padding: 0;
>> }
>> li {
>>         margin: .2em 0 .2em 3em;
>> }
>>
>> If I recall correctly, ie/win handles this a bit differently, so my 
>> suggestion may need a little tweaking for that browser.
>>
>> PS.  You had a padding of .5 on the li which I removed.  In order to 
>> be useful it would need a uint such as .5em.
>
>
> Ah, I went only halfway there when I redefined the <li> element. I 
> needed to zero out <ul> as well. But this still doesn't work in 
> IE6/Win. Looks perfect in Firefox1.0x/Win. Doesn't work in Safari/OSX.

I can't test in ie/win (I'm on a mac).  I can tell what is happening in 
safari 1.31, but I'm not sure how to fix it.  If you add a light 
background color to the li you will see how gecko and khtml differ.  In 
firefox/gecko the li element is affected by the float and thus moves 
over to accommodate it and the bullet is drawn relative to the li.  In 
safari/khtml the li flows under the float just like the ul does and 
there is sort of an invisible container that is affected by the floated 
image and the bullet is drawn relative to this anonymous block.

Unfortunately, the only way I've been able to think of to fix it in 
safari is to add extra markup inside the li.

Hopefully someone else on the list will have a solution.
Roger,

Roger Roelofs
"Remember, if you’re headed in the wrong direction,
        God allows U-turns!"
          ~Allison Gappa Bottke
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to