SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2006
    Posts
    48
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Exclamation remove gap between table... HOW?

    hi, i have 2 table in my page.

    <table>
    <tr><td>
    this is table 1
    </td></tr>
    </table>
    gap is here
    <table>
    <tr><td>
    this is table 2
    </td></tr>
    </table>

    how can i remove the gap between 2 tables?
    newbie...really need your guidance......

  2. #2
    SitePoint Addict drjones013's Avatar
    Join Date
    Jan 2007
    Location
    Las Vegas, NV
    Posts
    216
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There should be a way to style the tables in CSS and affect the margin of the table element.

    If you need help with this, post here-- there's a lot of people who've helped me (I learned HTML/CSS from SitePoint and it's publications).

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2006
    Posts
    48
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    oh... do this with CSS? mmm~ let me try out!

    thanks drjones013!
    newbie...really need your guidance......

  4. #4
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sounds like margins are rearing their ugly heads again. I'd suggest controlling the margins on the tables if you haven't done so already.

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    table {
      margin-top:0;
      margin-bottom:0;
      padding:0; /* just in case */
    }
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Member
    Join Date
    Apr 2007
    Location
    Nigeria
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    CSS will solve that problem. following will help:

    Put this in the head section i.e btw <head> and </head>

    <style type="text/css">
    <!--
    .nogap {margin-bottom:0px;}
    -->
    </style>
    --------------------------------------------------

    In body of the section, for the particluar table that you do not want
    the gap below, change it to this:

    <table class="nogap" >
    <tr><td>
    .
    .
    .

    This all you need to do.

  7. #7
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by olubiz View Post
    This all you need to do.
    Not necessarily. You also need to make sure that the second table has top-margin:0.

    BTW, welcome to SitePoint Forums, olubiz!
    Birnam wood is come to Dunsinane

  8. #8
    SitePoint Wizard silver trophybronze trophy Nadia P's Avatar
    Join Date
    Oct 2004
    Location
    NSW Australia
    Posts
    3,564
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This should do it... I've adding some padding to the table cells... change as needed. I've set the body margin and padding to zero also, change to suit.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
     body {margin: 0; padding:0}
        table {margin: 0; padding:0;}
        table td {padding: 6px;}
    -->
    </style>
    </head>
    <body>
    <table border="0" cellpadding="0" cellspacing="0">
    <tr><td>
    this is table 1
    </td></tr>
    </table>
    <table border="0" cellpadding="0" cellspacing="0">
    <tr><td>
    this is table 2
    </td></tr>
    </table>
    </body>
    </html>
    Nadia


Bookmarks

Posting Permissions

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