border problem

Discussion in 'HTML' started by Merlin, Jun 4, 2005.

  1. Merlin

    Merlin Guest

    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">
    ..two
    {
    BACKGROUND-COLOR: #F9F729;
    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;
    }
    </style>

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

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

    Thank you in advance,

    Merlin
     
    Merlin, Jun 4, 2005
    #1
    1. Advertising

  2. Merlin

    Els Guest

    Merlin wrote:

    > 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">
    > .two
    > {
    > BACKGROUND-COLOR: #F9F729;
    > COLOR: #1144AA;
    > border-style: solid;


    > border-width: 1px;
    > border-bottom-width: 0px;
    > border-top-width: 0px;


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

    > border-color: #FFFFFF;
    > MARGIN: 5px 2px 5px 2 px;
    > }
    > </style>
    >
    > <table >
    > <tr >
    > <td class="two" >menu 1</td>
    > <td class="two" >menu 2</td>
    > <td class="two" >menu 3</td>
    > </tr>
    > </table>
    >
    > Can anybody please give me an advice or a hint on how to do that?


    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 http://locusmeus.com/
    Sonhos vem. Sonhos vão. O resto é imperfeito.
    - Renato Russo -
     
    Els, Jun 4, 2005
    #2
    1. Advertising

  3. Merlin

    kchayka Guest

    Merlin wrote:
    >
    > 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.


    You want what's known as CSS buttons. If you google for it, you'll get
    oodles of samples and tutorials, such as:
    <URL:http://css.maxdesign.com.au/listamatic/vertical13.htm>

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

    --
    Reply email address is a bottomless spam bucket.
    Please reply to the group so everyone can share.
     
    kchayka, Jun 4, 2005
    #3
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. tshad
    Replies:
    0
    Views:
    2,264
    tshad
    Jan 31, 2005
  2. asjad

    Problem with selection border

    asjad, Sep 28, 2005, in forum: ASP .Net
    Replies:
    0
    Views:
    318
    asjad
    Sep 28, 2005
  3. phl
    Replies:
    1
    Views:
    4,354
    Martin Jay
    Jun 8, 2006
  4. Coder
    Replies:
    1
    Views:
    703
    Cowboy \(Gregory A. Beamer\)
    Jun 24, 2006
  5. =?UTF-8?B?TWFydGluIFDDtnBwaW5n?=

    border-color: #003366; border-width: 2px;

    =?UTF-8?B?TWFydGluIFDDtnBwaW5n?=, Jul 17, 2006, in forum: HTML
    Replies:
    64
    Views:
    3,536
    Adrienne Boswell
    Jul 30, 2006
Loading...

Share This Page