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
Re: margin of li-elements around left-floating image
Neal
  06-30-04 - 12:16 AM
On Tue, 29 Jun 2004 16:49:19 +0200, Chris Gurk <chrisgurk@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 differe
nt
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;}
Re: margin of li-elements around left-floating image
Chris Gurk
  06-30-04 - 05:15 PM
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