How to reduce table border thickness?

7.1k views Asked by At

I am drawing one table with border=1 but it looks quite prominent as I am enclosing one image inside it so I want to make it thinner for better look and feel.

<table border=1 cellpadding=50 cellspacing=0><tr><td></td></tr></table>

How can I reduce border thickness?

2

There are 2 answers

0
Rahul Tripathi On BEST ANSWER

You can style it like this:

td,
th {
  border: .1px solid black;
}
<table border=1 cellpadding=50 cellspacing=0>
  <tr>
    <td></td>
  </tr>
</table>

(JSFiddle demo)

0
Nithin CV On

This sample code may help you,

table {
  border: 5px solid blue;
}

caption {
  color: wheat;
}

th {
  border: 2px solid yellow;
  background-color: grey;
}

td {
  border: 3px solid red;
  background-color: green;
}
<table border=1 cellpadding=50 cellspacing=0>
  <caption>TABLE</caption>
  <thead>
    <tr>
      <th>H1</th>
      <th>H2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>1</td>
    </tr>
    <tr>
      <td>1</td>
      <td>1</td>
    </tr>
  </tbody>

  <tfoot>
    <tr>
      <td colspan="2">FOOTER</td>
    </tr>
  </tfoot>
</table>