Setting the distance between numbers and text in an ordered list.

R

richard_quick_uk

Hi,

Quick question that's been bugging me.

I want to set the distance between the numbers and the txt in an
ordered list - and I can't for the life of me figure out how in CSS.

Any ideas?

The CSS is:

ol {
padding: 0;
margin: 5px 0 10px 0;
margin-left: 23px;
color: #cc0000;
}

ol li {
list-style-position: outside;
margin: 0;
}

And the html is:

<ol>
<li><a href="#">The top tips text will go here</a></li>
<li><a href="#">The top tips text will go here</a></li>
<li><a href="#">The top tips text will go here</a></li>
</ol>


Richard Quick
 
D

dorayme

From: (e-mail address removed)
The CSS is:

ol { padding: 0; margin: 5px 0 10px 0; margin-left: 23px; color: #cc0000; }

ol li { list-style-position: outside; margin: 0; }

And the html is:

<ol> <li><a href="#">The top tips text will go here</a></li> <li><a
href="#">The top tips text will go here</a></li> <li><a href="#">The top tips
text will go here</a></li> </ol>

I'm always forgetting how to do things. Here is one way, perhaps not the
best, but it works as far as I can see for your list that consists of
links:

In the link css instructions put padding-left: 10px; or whatever px you
want. If you don't want this generally for links then you will need to
make the links for this a special (like a class).

A:link { color: #000099; background: #fff; padding-left: 10px;}

And, of course for hover and visited and active the same or different...

dorayme
 
R

rf

I want to set the distance between the numbers and the txt in an
ordered list - and I can't for the life of me figure out how in CSS.

ol li {padding-left: 23px;}

Cheers
Richard.
 
E

Ed

Hi,

Quick question that's been bugging me.

I want to set the distance between the numbers and the txt in an
ordered list - and I can't for the life of me figure out how in CSS.

Any ideas?

The CSS is:

ol {
padding: 0;
margin: 5px 0 10px 0;
margin-left: 23px;
color: #cc0000;
}

ol li {
list-style-position: outside;
margin: 0;
}

Add left padding to the list items: ol li { padding-left: 10px }
 

Ask a Question

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

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,906
Latest member
SkinfixSkintag

Latest Threads

Top