border problem

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
Hi there,

I am trying to craft a main menu where the background is yellow and there are
white 1px divisions between the menu items. Thats it. Doesn't sound to hard,
does it? Well I cant get it working :-(

Basicly I tried css with a table. The idea was to set the right and left border
to 1px white and to add a margin to each element so the text inside the menu box
has space to breath.

Here is my try:

<style type="text/css">
COLOR: #1144AA;
border-style: solid;
border-width: 1px;
border-bottom-width: 0px;
border-top-width: 0px;
border-color: #FFFFFF;
MARGIN: 5px 2px 5px 2 px;

<table >
    <tr >
        <td class="two" >menu 1</td>
        <td class="two" >menu 2</td>
        <td class="two" >menu 3</td>

Can anybody please give me an advice or a hint on how to do that?

Thank you in advance,


Re: border problem

Merlin wrote:

Quoted text here. Click to load it

The above three rules can be replaced by:
border-width: 0 1px;

Quoted text here. Click to load it

What would help a lot, is if you'd give a URL, or in this case at
least tell us what the current result is. Are there no white lines
between the cells? Or are there white lines with extra space between
the cells?

If all you want is a 1px white vertical line between cells, why are
you setting a margin on the cells? You want the text to have 'space to
breath' within the cell, right? That's done with padding, not margin.

Els            /
Sonhos vem. Sonhos vo. O resto imperfeito.
                             - Renato Russo -

Re: border problem

Merlin wrote:
Quoted text here. Click to load it

You want what's known as CSS buttons. If you google for it, you'll get
oodles of samples and tutorials, such as:

We don't need no stinkin' tables. :)

Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

Site Timeline