Home › Varia › CSS one-pixel table border

CSS one-pixel table border

April 8, 2010 - 6:07pm — Xuan Ngo 

<html>
  <head>
    <title>1-pixel table border</title>
    <style type="text/css">
      table, td
      {
          border-color: #600;
          border-style: solid;
      }
 
      table
      {
          border-width: 0 0 1px 1px;
          border-spacing: 0;
          border-collapse: collapse;
      }
 
      td
      {
          margin: 0;
          padding: 4px;
          border-width: 1px 1px 0 0;
          background-color: #FFC;
      }
    </style>
  </head>
 
  <body>
    <table>
    <tr>
        <td>Cell 1</td>
        <td>Cell 2</td>
    </tr>
    <tr>
        <td>Cell 3</td>
        <td>Cell 4</td>
    </tr>
    </table>
 
  </body>
</html>

reference:
http://www.visakopu.net/misc/table-border-css/

<!-- Short version -->
<head>
  <style type="text/css">
    table {
      background-color:#FFF;
      width:100%;
      border-collapse:collapse;
    }
 
    /* and of course a default one */
    td, th {
      border: 1px solid black;
      padding: 5px;
      text-align: center;
    }
 
    th{ background-color: gray; }
 
  </style>
</head>