Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Nov 2008
    Posts
    317
    Thanks
    159
    Thanked 0 Times in 0 Posts

    Tables no padding

    I can't seem to get my <td>s (or the little boxes of content) to have any padding. I don't want the text right up on my border.

    HTML:
    Code:
    <table id="playlist">
      <tbody>
        <tr class="odd">
          <td>Title</td>
    <td>Play</td>
    
    <td>Length</td>
    <td>Tempo</td>
    
        </tr>
        <tr>
                <td>Beat Number One</td>
    <td><object type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20">
        <param name="movie" value="player_mp3_mini.swf">
        <param name="bgcolor" value="#000000">
        <param name="FlashVars" value="mp3=Scaryist.mp3&amp;bgcolor=ffffff&amp;loadingcolor=808080&amp;buttoncolor=FFFFFF&amp;slidercolor=FFFFFF">
    </object></td>
    
    <td>5:33</td>
    <td>140bps</td>
    
        </tr>
        <tr>
                <td>Title</td>
    <td>Play</td>
    
    <td>Length</td>
    <td>Tempo</td>
    
        </tr>
        <tr>
                <td>Title</td>
    <td>Play</td>
    
    <td>Length</td>
    <td>Tempo</td>
    
        </tr>
      </tbody>
    </table>
    CSS:
    Code:
        #playlist tr {
          background-color: #000000;
          padding: 20px;
          color: #fff;
          margin: 4px 4px 4px 4px;
        }
        #playlist td tbody {
          padding: 20px;
          margin: 4px 4px 4px 4px;
        }
    #playlist tr.odd {
          background-color: #505050;
          padding: 20px;
          margin: 4px 4px 4px 4px;
    }
    And also, if someone wants to help me clean that up that would be great. I tended to get different results when I seperated them like that... Idk. Any help is appriciated.

  • #2
    Regular Coder
    Join Date
    Oct 2007
    Location
    Glencoe, Ontario, Canada
    Posts
    340
    Thanks
    19
    Thanked 27 Times in 27 Posts
    Code:
    HTML
    <table>
      <tbody>
        <tr class="special">
          <td>Title</td>
    <td>Play</td>
    
    <td>Length</td>
    <td>Tempo</td>
    
        </tr>
        <tr>
                <td>Beat Number One</td>
    <td><object type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20">
        <param name="movie" value="player_mp3_mini.swf">
        <param name="bgcolor" value="#000000">
        <param name="FlashVars" value="mp3=Scaryist.mp3&amp;bgcolor=ffffff&amp;loadingcolor=808080&amp;buttoncolor=FFFFFF&amp;slidercolor=FFFFFF">
    </object></td>
    
    <td>5:33</td>
    <td>140bps</td>
    
        </tr>
        <tr>
                <td>Title</td>
    <td>Play</td>
    
    <td>Length</td>
    <td>Tempo</td>
    
        </tr>
        <tr>
                <td>Title</td>
    <td>Play</td>
    
    <td>Length</td>
    <td>Tempo</td>
    
        </tr>
      </tbody>
    </table>

    Code:
    CSS
    table {
    background:#000000;
    
    font-weight:bold;
    color:#FFFFFF;
    }
    
    td {
    padding: 20px;
    }
    
    .special {
    background: #505050;
    }
    
    Give that a try i think thats what your after.
    Eric "PitbullMean" Melo
    Always Start your layout with*{border:0; margin:0; padding:0;}
    Be sure to Thank ALL Users who give assistance.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •