margin of li-elements around left-floating image

[Chris Gurk]

Hi Newsgroup,

I am working on a website http://www.charter-yachtcharter.com/testsite/
(still in progress).

There are two lists. The first is a simple paragraph (<p>-Tag), the
second an unordered list.
How can I use a Style-Sheet to format the bullets to be aligned like the
text above. The problem is the floating catamaran-image which is
floating left around the first paragraph on this site.
I tried to place the list under the image with some linebreaks <br>.
There it was possible to set the margins of the li-elements.
Is there a better way to position these element on this site?

Thanks, Chris
--
Chris Gurk can be reached at:
http://www.gurkcity.de

[Neal]

On Tue, 29 Jun 2004 16:49:19 +0200, Chris Gurk <ch*******@gmx. de> wrote:

Hi Newsgroup,

I am working on a website http://www.charter-yachtcharter.com/testsite/
(still in progress).

There are two lists. The first is a simple paragraph (<p>-Tag), the
second an unordered list.
How can I use a Style-Sheet to format the bullets to be aligned like the
text above. The problem is the floating catamaran-image which is
floating left around the first paragraph on this site.
I tried to place the list under the image with some linebreaks <br>.
There it was possible to set the margins of the li-elements.
Is there a better way to position these element on this site?

Thanks, Chris
--
Chris Gurk can be reached at:
http://www.gurkcity.de

ul {margin-left: 2em} or whatever works. Different browsers set different
default margins and paddings for ul and li. You ought to try something
like this to override that when CSS is observed:

ul {margin:0; padding:0; margin-left: 2em;}
li {margin:0; padding:0;}

[Chris Gurk]

Thank you very much.

I solved the problem with your help:

ul {padding: 0; margin: 0 0 0 210px;}

The 210px is a value which seems to be left-floating image-width (in my
case the width of the image is 170px)plus the margin to the image and
the text-indent plus the padding of the surrounding content-box in which
all paragraphs, images and lists are positioned.

I tried it with smaller values (like 2em, 170px) and there were still
some strange effects on Mozilla Firefox and Internet Explorer, too.

My explanation: The margin of ul is not a distance to the floating
image, it is the distance to the surrounding content box.

Chris

--
Chris Gurk can be reached at:
http://www.gurkcity.de