HTML/CSS Table border question

[Akumos]

Hi All

I'm trying to create a table with a border around the whole table...



My code is below, but I'm having trouble trying to find how to add a border around the outline of the whole table instead of every cell? I'm using DW CS5.

Thanks for reading!

<table width="90%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="4" bgcolor="#D4BF55">TITLE</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

 

[temp02]

Nested tables perhaps, main table with border and just one cell with a table with no border inside this only cell? Like this:

<table width="90%" border="15">
<tbody>
  <tr>
    <td>
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tbody>
        <tr>
          <td colspan="4" bgcolor="#D4BF55">TITLE</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
      </tbody>
      </table>
    </td>
  </tr>
</tbody>
</table>

 

[Akumos]

Thanks for the fast reply temp!!

I have already made most of the layouts and doing it this way would take me a while (some of the borders I only want around half the table).

Is there a way of adding individual properties (eg. border-left or border-bottom (or the HTML equivilant) to the <td> tag?

 

[Disparia]

Give the table a style="border:1px solid black" instead of the border attribute.

 

[Akumos]

Where does the style tag go? inside <table...

 

[Disparia]

Yup. This would put a border on the table only. You can of course style it beyond my example.

<table style="border:1px solid black">
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>

For your other question, can make a class to style multiple tags.

<style type="text/css">
.bl { border-left:1px solid black; }
</style>

<table>
    <tr>
        <td class="bl">&nbsp;</td>
        <td class="bl">&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>

Like many things in life, there are several ways to accomplish these things. This is just one of them.

 

[Akumos]

Works perfectly, thanks Jizzler! I didn't know about styles!

Is there a way to apply a style to text.. kind of like h1, h2, h3 etc... When I try to reformat h2, h3 etc... I get a big gap underneath the text which I dont want!