table help

mtaylor314 · 05-01-2007, 08:51 AM

I have a table w/ one tr and several td's. The style from the client would just like a simple pipe '|' between td's as the separator. What is a simple way to code the table to look like this

Home | Contact | Site Map | Links

Thanks in advance for the help

brealmz · 05-01-2007, 09:39 AM

<a href="contact.html">Contact</a> <span class="pipe">| </span>

<style>
.pipe{
margin-left:15px;
margin-right:15px;
}
</style>

chicgeek · 05-01-2007, 09:43 AM

That's not employing tables, though.
(Why tables, anyhow?)

<td class="menu">Home</td>
<td class="menu">Contact</td>
<td class="menu">Site Map</td>
<td>Links</td>

.menu {
border-right: 1px black solid;
}

Costin Trifan · 05-01-2007, 10:37 AM

Use an unordered list instead.

HTML Code:

<style type="text/css" media="screen">

ul.ListMenu
{
    display: inline;
    list-style-type: none;
}
ul.ListMenu li.ListItem
{
    display: inline;
    list-style-type: none;
}

</style>

<body>
    <div id="MenuContainerDiv">
        <ul class="ListMenu">
            <li class="ListItem">Home</li>
            <li class="ListItem">&nbsp;|&nbsp;</li>
            <li class="ListItem">Contact</li>
            <li class="ListItem">&nbsp;|&nbsp;</li>
            <li class="ListItem">Site map</li>
            <li class="ListItem">&nbsp;|&nbsp;</li>
            <li class="ListItem">Links</li>
        </ul>
    </div>
</body>

Hope this helps you!