padding in <ul>?

Discussion in 'HTML' started by Dano, Apr 10, 2005.

  1. Dano

    Dano Guest

    Hi,

    I have some images instead of the regular bullets on several pages on my
    site, but I want the text of the <LI>'s a bit more to the right
    (padding-like).

    It is shown e.g. on:
    http://www.ltvborgharen.nl/heren3.shtml and
    http://www.ltvborgharen.nl/contact.shtml

    The markup for the <UL> is like this:
    ul.mail {list-style-image: url('img/mail.gif'); list-style-position:
    inside; }

    Any suggestions how this can be fixed in CSS?

    regards
    Dan
    Dano, Apr 10, 2005
    #1
    1. Advertising

  2. Dano

    Toby Inkster Guest

    Dano wrote:

    > I have some images instead of the regular bullets on several pages on my
    > site, but I want the text of the <LI>'s a bit more to the right
    > (padding-like).


    Add some white space to the image itself using your graphics editor.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Apr 10, 2005
    #2
    1. Advertising

  3. Dano

    dorayme Guest

    > From: "Dano" <>

    > Hi,
    >
    > I have some images instead of the regular bullets on several pages on my
    > site, but I want the text of the <LI>'s a bit more to the right
    > (padding-like).
    >
    > It is shown e.g. on:
    > http://www.ltvborgharen.nl/heren3.shtml and
    > http://www.ltvborgharen.nl/contact.shtml
    >
    > The markup for the <UL> is like this:
    > ul.mail {list-style-image: url('img/mail.gif'); list-style-position:
    > inside; }
    >
    > Any suggestions how this can be fixed in CSS?



    There seems to be trouble with your css *apart* from the placement of list
    style image. Turning off all css fixes it because there is no float or em
    restricted widths. Also it disappears by making my browser fonts unusually
    big. Mac IE and Mozilla. Try your browser but "alt -" or "command -" it and
    it may appear on yours...

    There may be trouble with the space allowed or the code for providing for
    the nav div itself... sorry, have not looked into it but you may need to
    look into it. Ask again if no such trouble can be seen by you...

    dorayme
    dorayme, Apr 10, 2005
    #3
  4. Dano wrote:

    > The markup for the <UL> is like this:
    > ul.mail {list-style-image: url('img/mail.gif'); list-style-position:
    > inside; }


    How have you found crossbrowser compatability to be using
    list-style-image?

    --
    Blinky Linux Registered User 297263
    Who has implemented Usenet Solution #45933:
    Now killing all posts originating at Google Groups
    Blinky the Shark, Apr 10, 2005
    #4
  5. in alt.html, Blinky the Shark wrote:

    > How have you found crossbrowser compatability to be using
    > list-style-image?


    AFAIK it is very good. Actully, can't think *any* property that is better
    supported... (there is less issues than with margin, font-size, color...)

    IIRC, works at least with: NN4 (all), IE4+, Opera 4+, MacIE5.2, Mozilla
    (from way before 1.0)...

    Never seen it break.

    There may be some pixel perfectness problems, but I have never cared for
    them.

    --
    Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
    Utrecht, NL.
    Support me, buy Opera:
    https://secure.bmtmicro.com/opera/buy-opera.html?AID=882173
    Lauri Raittila, Apr 10, 2005
    #5
  6. Dano

    Dano Guest

    "dorayme" <> schreef in bericht
    news:BE7FE320.10D5C%...
    >> From: "Dano" <>

    >
    >> Hi,
    >>
    >> I have some images instead of the regular bullets on several pages on my
    >> site, but I want the text of the <LI>'s a bit more to the right
    >> (padding-like).
    >>
    >> It is shown e.g. on:
    >> http://www.ltvborgharen.nl/heren3.shtml and
    >> http://www.ltvborgharen.nl/contact.shtml
    >>
    >> The markup for the <UL> is like this:
    >> ul.mail {list-style-image: url('img/mail.gif'); list-style-position:
    >> inside; }
    >>
    >> Any suggestions how this can be fixed in CSS?

    >
    >
    > There seems to be trouble with your css *apart* from the placement of list
    > style image. Turning off all css fixes it because there is no float or em
    > restricted widths. Also it disappears by making my browser fonts unusually
    > big. Mac IE and Mozilla. Try your browser but "alt -" or "command -" it
    > and
    > it may appear on yours...


    The CSS validates and I see no strange things happen in Mozilla or Opera.
    Can you specify what you mean?

    > There may be trouble with the space allowed or the code for providing for
    > the nav div itself... sorry, have not looked into it but you may need to
    > look into it. Ask again if no such trouble can be seen by you...


    I've made the image itself a bit wider.

    Dan
    Dano, Apr 11, 2005
    #6
  7. Dano

    Dano Guest

    "Lauri Raittila" <> schreef in bericht
    news:...
    > in alt.html, Blinky the Shark wrote:
    >
    >> How have you found crossbrowser compatability to be using
    >> list-style-image?

    >
    > AFAIK it is very good. Actully, can't think *any* property that is better
    > supported... (there is less issues than with margin, font-size, color...)
    >
    > IIRC, works at least with: NN4 (all), IE4+, Opera 4+, MacIE5.2, Mozilla
    > (from way before 1.0)...
    >
    > Never seen it break.
    >
    > There may be some pixel perfectness problems, but I have never cared for
    > them.


    How could this be fixed?

    Dan
    Dano, Apr 11, 2005
    #7
  8. On 2005-04-10 04:37:15 -0400, "Dano" <> said:

    > Hi,
    >
    > I have some images instead of the regular bullets on several pages on
    > my site, but I want the text of the <LI>'s a bit more to the right
    > (padding-like).
    >
    > It is shown e.g. on:
    > http://www.ltvborgharen.nl/heren3.shtml and
    > http://www.ltvborgharen.nl/contact.shtml
    >
    > The markup for the <UL> is like this:
    > ul.mail {list-style-image: url('img/mail.gif'); list-style-position:
    > inside; }
    >
    > Any suggestions how this can be fixed in CSS?


    Well, first of all, I don't see the word mail in any of your markup, so
    the css rule you're trying to use can't find anything to style.

    http://validator.w3.org/check?verbose=1&uri=http://www.ltvborgharen.nl/heren3.shtml
    William Hamby, Apr 12, 2005
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Dave
    Replies:
    7
    Views:
    5,642
    Joe Smith
    Jul 22, 2004
  2. RA
    Replies:
    1
    Views:
    363
  3. Becker

    Padding between textboxes

    Becker, Jun 24, 2004, in forum: ASP .Net
    Replies:
    4
    Views:
    1,264
    Eliyahu Goldin
    Jun 24, 2004
  4. =?Utf-8?B?U2FuZHk=?=

    VB code and Sql Server Ansi Padding

    =?Utf-8?B?U2FuZHk=?=, May 11, 2005, in forum: ASP .Net
    Replies:
    2
    Views:
    2,459
    =?Utf-8?B?U2FuZHk=?=
    May 11, 2005
  5. Robert Smith
    Replies:
    0
    Views:
    4,931
    Robert Smith
    Dec 8, 2005
Loading...

Share This Page