Help with css

dropadrop

Gawd
Joined
Feb 28, 2001
Messages
569
I'm trying to figure out an elegant way to make navigation for my website. Currently I have it working using a piece of an old thing I did a few years back. The old way uses tables, not stylesheets.

old way

new way

Is there a way to get the stylesheet to place the links with gaps between then without using tables? Or should I use less tables then the old one, and specify the width of each row in the stylesheet? Another problem with the new one is the gap above and below the text.
 
Here's an example of one way you can do it:

Code:
<div id="link-container">
    <a href="http://www.google.com">Link1</a>
    <a href="http://www.google.com">Link2</a>
    <a href="http://www.google.com">Link3</a>
</div>

Then for your stylesheet:

Code:
#link-container {
    width: 500px;
    border: 1px solid #f00;
    text-align: center;
    padding: 5px;
}
#link-container a {
    margin-left: 20px;
    margin-right: 20px;
}

That'll give you the idea. From there you should be able to do it however you want.
 
Back
Top