spacing between links

[sunnny]

Hi,

I was wondering if we can control the vertical spacing between links using CSS.

Thanks,
Sunny

[createErrorMsg]

I would say a definitive "yes," but we would need to know how the links look in the source code (are they part of an unordered list? a string of anchors styled to display:block? seperated by <br /> tags?) in order to say what property to use to do the spacing. But you can control the vertical spacing between just about anything via CSS, so fill us in on the specifics.

cEM

[sunnny]

Thanks for the reply. The links are anchors inside an unordered list. Like this:

<ul>
<li><a href="">Link One</a></li>
<li><a href="">Link Two</a></li>
<li><a href="">Link Three</a></li>
<li><a href="">Link Four</a></li>
</ul>

Sunny

[D_Blackwell]

You can use something like:

li {
margin: 1.3em 0;
}

with which you can control the vertical space between <li>.

[zackattack]

sunny

to explain a little further, only because I didnt know what this all meant when I started using CSS

what D_Blackwell is applying here is margin to the top and bottom of the <li> tag and is using a short hand set of values for this.

The value written in full is:

li {
margin: 1.3em 0 1.3em 0;
}

so there are 4 values for margin, these are TOP RIGHT BOTTOM LEFT respectively.

If you start usng CSS allot you will find this VERY useful to know

You can use different kinds of values to define the spacing as another example it could be written as:

li {
margin: 13px 0 13px 0;
}

However ems are a good choice because the spacing between your <li> elements will scale in proportion, should a visitor to your website want to increase the font size

ZA

PS this is meant to expand the explanation just a little more hopefully to help

[sunnny]

Thankyou very much zackattack for your help and good explanation, it worked! Thankyou D_Blackwell :)

Sunny

[sunnny]

one more thing, how can I specify a size for lists. For example I use list style disc for my lists but I find them too big so I was wondering if there is a way to specify a size for them. Thanks!

Sunny

[D_Blackwell]

If by size you are meaning the size of the list-style-type: - no, you can't control that. However, you can use list-style-image: instead, and select your own image for the list-item marker.