SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2002
    Location
    UK
    Posts
    57
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    OL positioning problem in NS7

    Hi all,

    I'm working on a new design for my site and am trying to utilise the OL tag to position and use a custom bullet. All works fine in IE6, but in NS7x it loses the custom bullet and the positioning is also wrong.

    I'm using the following CSS to control the OL tag:

    Code:
    ol {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 11px;
     color: #5C83AD;
     list-style-image: url(../../gfx/bullet.gif);
     padding: 10px 10px 10px 0px;
     list-style-position: outside;
     margin: 0px;
    }
    You can also view the page here: http://www.psmeg.co.uk/v7/

    Any help would be appreciated.

    Regards

    Psmeg

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,374
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Mozilla uses padding to display its bullets and IE uses margins therefore you need to mess about with both to achieve the effect you want.

    Setting margin and padding to 0 as you have done will in fact not allow any room for the bullet to show. (This has a similar effect as to list-style-type:none)

    Try this:
    Code:
    ol {
     font-family: Geneva, Arial, Helvetica, sans-serif;
     font-size: 11px;
     color: #5C83AD;
     list-style-image: url(gfx/bullet.gif);
     padding: 10px 10px 10px 10px;
     list-style-position: outside;
     margin: 10px;
    }
    You can tweak the padding-left and the margin-left to make sure moz/nn look more or less the same.

    Paul

  3. #3
    SitePoint Enthusiast
    Join Date
    Nov 2002
    Location
    UK
    Posts
    57
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Paul,

    You're right, I just started playing with the margin settings and as you say it spaces better in NN.

    Thanks

    Psmeg


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •