How to control gaps in elements of <ul>

Discussion in 'HTML' started by Netx, Dec 9, 2008.

  1. Netx

    Netx Guest

    For example I uploaded a list in html:
    http://www.cavea.yoyo.pl/index3.html
    Please tell if it is possible (and how) to control space (a gap)
    between:
    "aaa" and a disc (or circle) at the left. Here it looks OK, but
    in joomla I am at the point that somehow this gaps seems to have
    grown and I want to minimize them possibly in stylesheet of the
    template but I have no idea how to achieve this.

    Thanks,
    Mark
     
    Netx, Dec 9, 2008
    #1
    1. Advertising

  2. Netx

    dorayme Guest

    In article <493dcf6d$0$29365$>,
    "Netx" <> wrote:

    > For example I uploaded a list in html:
    > http://www.cavea.yoyo.pl/index3.html
    > Please tell if it is possible (and how) to control space (a gap)
    > between:
    > "aaa" and a disc (or circle) at the left. Here it looks OK, but
    > in joomla I am at the point that somehow this gaps seems to have
    > grown and I want to minimize them possibly in stylesheet of the
    > template but I have no idea how to achieve this.
    >


    Best to get the mark up correct first.

    <ul>
    <li>AAA</li>
    <li>BBB
    <ul>
    <li>aaa</li>
    <li>bbb</li>
    </ul>
    </li>
    </ul>

    is one way. (Look closely at yours!)

    Some left padding on the list items is a control on this. But you may
    need to ensure all paddings and margins are specified on all ULs and LIs
    for best cross browser similarity.

    ul, li {padding: 0; margin: 0;}

    and put in just the ones that matter to you below this. For example:

    li {padding-left: 10px;}.

    and some margin, important to get the bullets in. Different browsers
    have their own defaults for how they place bullets.

    --
    dorayme
     
    dorayme, Dec 9, 2008
    #2
    1. Advertising

  3. Netx

    Lars Eighner Guest

    In our last episode, <493dcf6d$0$29365$>, the lovely
    and talented Netx broadcast on alt.html:

    > For example I uploaded a list in html:
    > http://www.cavea.yoyo.pl/index3.html
    > Please tell if it is possible (and how) to control space (a gap)
    > between:
    > "aaa" and a disc (or circle) at the left. Here it looks OK, but
    > in joomla I am at the point that somehow this gaps seems to have
    > grown and I want to minimize them possibly in stylesheet of the
    > template but I have no idea how to achieve this.



    First, nest ULs properly:

    <ul>
    <li>aaa
    <ul>
    <li>bbb</li>
    ....
    </li></ul>


    When it is as you have:

    <ul>
    <li>aaa</li>
    <ul>
    <li> ...

    when the browser comes to the second UL, it believes you closed the first
    one implicitly.

    All that can go in UL is LI. Bare text or another UL cannot.

    The first step in styling a document is to be sure you have valid markup.


    --
    Lars Eighner <http://larseighner.com/>
    WWJD: What Would Jenna Drink?
     
    Lars Eighner, Dec 9, 2008
    #3
    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. Arthur Dent
    Replies:
    1
    Views:
    1,076
    Jim Gibson
    Dec 3, 2003
  2. greg
    Replies:
    4
    Views:
    384
  3. Mark247
    Replies:
    1
    Views:
    627
    Marrow
    Sep 3, 2004
  4. Andrey
    Replies:
    6
    Views:
    375
    Andrew Koenig
    Jun 24, 2004
  5. Sulsa

    Gaps in memory

    Sulsa, Feb 13, 2005, in forum: C++
    Replies:
    6
    Views:
    404
    Phil Staite
    Feb 16, 2005
Loading...

Share This Page