...

View Full Version : Stagger Text in Links Bar



alohatech
12-16-2006, 05:09 AM
I am new to css and admit I have a lot to learn.

I have a column of links in a sidebar and what I would like to do is stagger each link (1st link indent 50 px, 2nd link indent 0 px, 3rd link indent 50 px, 4th link indent 0 px, ect)

Is there a way to do this with css, I have tried a few things but my text formatting keeps changing. Below is the css code I have applying to my sidebar.

Thanks for any help you can offer to this newbie.


#sidebar ul {
list-style-type: none;
width: 100%;
display: block;
margin: 0;
padding: 0;
}
#sidebar li {
display: block;
}
#sidebar a {
font-size: 1.3em;
font-weight: bold;
text-decoration: none;
color: #00f;
display: block;
text-indent: -0px;
padding: 15px;
padding-left:5px
}
#sidebar a:hover {
font-size: 1.5em;
text-decoration: none;
color: #f00;
}

whizard
12-16-2006, 05:19 AM
CSS


a.indent
{
margin-left:50px;
}


HTML


<a class="indent">first indented link</a>
<a>first normal link</a>
<a class="indent">second indented link</a>
<a>first normal link</a>


and so on..

Also, are you aware that you can only apply an ID to one element in an HTML doc?

Dan

alohatech
12-16-2006, 06:43 PM
Thanks for your help, that did the trick.

whizard
12-16-2006, 07:58 PM
No Problem!

Dan



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum