Table borders?

HTML & CSS
1

Can anyone see where this code is going wrong please? For some reason the styles for the sizes of the borders are not working? ;-(

<table cellspacing="30px" cellpadding="30px" width="96%" style="background-color:#008EA6; border-top:14px; border-right:16px; border-bottom:14px; border-left:16px; solid #008ea6;">
<tr>
<td bgcolor="#febc11" width="100%">

<table width="100%"; style="border:10px solid #febc11; cellpadding="24" border-top:13px; border-right:16px; border-bottom:13px; border-left:16px">
2

Your code would be a lot easier to understand if you separated your HTML and CSS.

I’m not aware that this is a CSS style…

3

It’s for emails, so have to do it all inline. Can you see why the styles for the borders are not working?

4

Ah, okay. As I say it looks like the cellspacing is out of place, and has no terminating semicolon either…

5

Thanks, will look at that. Any ideas on the border stuff?

6

I’m guessing it’s to do with the double quotes around cellpadding="24". Try using single quotes and see if that helps. (I’m assuming that’s the correct way to declare cellpadding, and it shouldn’t be 24px.)

7

How about the border styles now?

<table cellspacing="130px" cellpadding="30px" width="96%" style="background-color:#008EA6; border-top:14px; border-right:16px; border-bottom:14px; border-left:16px; solid #008ea6;">
<tr>
<td bgcolor="#febc11" width="100%">

<table width="100%"; style="border:10px solid #febc11; border-top:13px; border-right:16px; border-bottom:13px; border-left:16px">
8

Be careful with the shortened border rules as emails don’t really like them.

Do it like this:

<table cellspacing="30" cellpadding="30" width="96%" style="background-color:#008EA6;border:16px solid #008ea6; border-top:14px solid #008ea6;border-bottom:14px solid #008ea6;">
  <tr>
    <td bgcolor="#febc11" cellpadding="24" width="100%"><table width="100%" style="border:13px solid #febc11; border-right:16px solid #febc11;border-left:16px solid #febc11">
        <tr>
          <td>test</td>
        </tr>
      </table></td>
  </tr>
</table>

Also cellpadding and cellspacing are pixel measurements and shouldn’t have the px on the end (like a lot (not all) of old style presentational attributes).

Make sure you have the correct table tags in place as you only seem to show some of them each time.

1 Like
11

As mentioned, this is for emails - completely different ball game!

12

Unfortunately, emails still need to be built using table layouts and inline styles.

13

Yep!

14

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.