Table to CSS

Discussion in 'HTML' started by Jay, Jul 12, 2004.

  1. Jay

    Jay Guest

    I am trying to get rid of tables on my website that are not used for tabular
    data. I have one table that holds a menu selection as such:

    <table width="100%">
    <tr>
    <td width="16%">Menu Item</td>
    <td width="16%">Menu Item</td>
    <td width="16%">Menu Item</td>
    <td width="16%">Menu Item</td>
    <td width="16%">Menu Item</td>
    <td width="16%">Menu Item</td>
    </tr>
    </table>

    I would like to use CSS to position these elements in the same fashion as
    above.

    Any tips?

    --
    JayB
     
    Jay, Jul 12, 2004
    #1
    1. Advertising

  2. Jay

    Kris Guest

    In article <jrzIc.577$>,
    "Jay" <> wrote:

    > I am trying to get rid of tables on my website that are not used for tabular
    > data. I have one table that holds a menu selection as such:
    >
    > <table width="100%">
    > <tr>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > </tr>
    > </table>
    >
    > I would like to use CSS to position these elements in the same fashion as
    > above.
    >
    > Any tips?


    <ul id="navigation">
    <li>Menu Item</li>
    ....
    </ul>

    #navigation li {
    float: left;
    width: 16%;
    }

    That's the basic setup.

    --
    Kris
    <> (nl)
     
    Kris, Jul 12, 2004
    #2
    1. Advertising

  3. Jay

    Stephen Guest

    In news:jrzIc.577$,
    Jay <> expounded:
    | I am trying to get rid of tables on my website that are not used for
    | tabular data. I have one table that holds a menu selection as such:
    |
    | <table width="100%">
    | <tr>
    | <td width="16%">Menu Item</td>
    | <td width="16%">Menu Item</td>
    | <td width="16%">Menu Item</td>
    | <td width="16%">Menu Item</td>
    | <td width="16%">Menu Item</td>
    | <td width="16%">Menu Item</td>
    | </tr>
    | </table>
    |
    | I would like to use CSS to position these elements in the same
    | fashion as above.
    |
    | Any tips?

    This would do it. You can adjust the padding f necessary to make the display
    what you want.

    --

    stephen
     
    Stephen, Jul 12, 2004
    #3
  4. Jay

    Toby Inkster Guest

    Toby Inkster, Jul 12, 2004
    #4
  5. Jay

    Stephen Guest

    In news:bHzIc.54723$,
    Stephen <> expounded:
    | In news:jrzIc.577$,
    | Jay <> expounded:
    || I am trying to get rid of tables on my website that are not used for
    || tabular data. I have one table that holds a menu selection as such:
    ||
    || <table width="100%">
    || <tr>
    || <td width="16%">Menu Item</td>
    || <td width="16%">Menu Item</td>
    || <td width="16%">Menu Item</td>
    || <td width="16%">Menu Item</td>
    || <td width="16%">Menu Item</td>
    || <td width="16%">Menu Item</td>
    || </tr>
    || </table>
    ||
    || I would like to use CSS to position these elements in the same
    || fashion as above.
    ||
    || Any tips?
    |

    This would do it. You can adjust the padding if necessary to make the
    display what you want.

    <div align="center">
    <a href="2001.shtml" style="padding-right:2em">2001 articles</a>
    <a href="2002.shtml" style="padding-right:2em">2002 articles</a>
    <a href="back.shtml" style="padding-right:2em">background images</a>
    <a href="empath.shtml" style="padding-right:2em">empathic journey</a>
    <a href="guest.shtml" target="_blank"
    style="padding-right:2em">guestbook</a>
    <a href="index.shtml">home</a>
    </div>

    --

    stephen
     
    Stephen, Jul 12, 2004
    #5
  6. Jay

    Mitja Guest

    Jay <>
    (news:jrzIc.577$) wrote:
    > I am trying to get rid of tables on my website that are
    > not used for tabular data. I have one table that holds a
    > menu selection as such:
    >
    > <table width="100%">
    > <tr>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > </tr>
    > </table>
    >
    > I would like to use CSS to position these elements in the
    > same fashion as above.
    >
    > Any tips?


    What Kris suggested. Note, however, that CSS doesn't mean saying no to
    tables. You can leave the table as it is and style it with CSS. This is
    better than what you have (more flexible), though still not as good as the
    floating version (which is semantically more suggestive, since it's a _list_
    of links you have)
     
    Mitja, Jul 12, 2004
    #6
  7. Jay

    Webcastmaker Guest

    In article <jrzIc.577$>,
    says...
    > I am trying to get rid of tables on my website that are not used for tabular
    > data.

    Use this knowledge wisely.

    > I have one table that holds a menu selection as such:
    > <table width="100%">
    > <tr>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > <td width="16%">Menu Item</td>
    > </tr>
    > </table>
    >
    > I would like to use CSS to position these elements in the same fashion as
    > above.
    > Any tips?


    Use an UL for the menu.

    http://www.moronicbajebus.com/playground/cssplay/hormenu/

    Google "UL horizontal menu CSS" for more samples

    --
    WebcastMaker
    The easiest and most affordable way to create
    Web casts, or put presentations on the Web.
    www.webentations.com
     
    Webcastmaker, Jul 12, 2004
    #7
    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. David Williams
    Replies:
    2
    Views:
    1,137
    Jacob Yang [MSFT]
    Aug 12, 2003
  2. Eric
    Replies:
    4
    Views:
    734
    clintonG
    Dec 24, 2004
  3. Rio
    Replies:
    4
    Views:
    1,200
  4. Replies:
    3
    Views:
    907
    richard
    Sep 24, 2006
  5. vitay
    Replies:
    8
    Views:
    552
    Stan McCann
    Nov 9, 2006
Loading...

Share This Page