Web Design Web Design Forum
Registration is free! Here you can view your subscribed threads, work with private messages and edit your profile and preferences Calendar Find other members Frequently Asked Questions Search
Home Web Design

Convenient web based access to our favorite web design Usenet groups

web design reviews

This is Interesting: Free Magazines for Graphics designers and webmasters  





  Last Thread  Next Thread
Author
Thread Post New Thread   

margin of li-elements around left-floating image
 

Chris Gurk




quote this post edit post

IP Loged report this post

Old Post  06-29-04 - 05:15 PM  
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



Post Follow-Up to this message ]
Re: margin of li-elements around left-floating image
 

Neal




quote this post edit post

IP Loged report this post

Old Post  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;}


Post Follow-Up to this message ]
Re: margin of li-elements around left-floating image
 

Chris Gurk




quote this post edit post

IP Loged report this post

Old Post  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



Post Follow-Up to this message ]
Sponsored Links
 





All times are GMT. The time now is 04:16 AM. Post New Thread   
  Previous Last Thread   Next Thread next
Stylesheets archive | Show Printable Version | Email this Page | Subscribe to this Thread

Popular forums

Adobe Photoshop forum Macromedia Flash Web Site Design
Dreamweaver FrontPage forum
JavaScript Forum XML forum
Style Sheets VRML
Forum Jump:
Rate This Thread:

 

XML RSS Feed web design latest articles Syndicate our forum via XML or simple JavaScript

Web Design archive  Database administration help  


Top Home  -  Register  -  Control Panel   -  Memberlist  -  Calendar  -  Faq  -  Search Top