Tables, bordercolor w3 validation errors, and CSS

May 1st, 2007 by Steve

If you are trying to validate your HTML with Dreamweaver or w3.org, you may have noticed errors stating there is no such attribute as “bordercolor”. Once again, CSS saves the day. The quick solution is to add a style class then insert the tables in a span:
.tbblue table, .tbblue td { border: 1px solid #0000ff; background-color: #000000; color: #00FFFF;}

<span class="tbblue"> <table width="60%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>=1=</td><td>=2=</td>
</tr>
<tr>
<td>=3=</td><td>=4=</td>
</tr>
</table></span>

Should result in this 2×2 table:

=1= =2=
=3= =4=

Another option does not even require the use of CSS; Just give the table a background color and cellspacing a size equal to your desired border, then give the table cells a different background color. If you put the table in a span like I did in the first example, you can avoid having to define the background color (bgcolor=”#000000″) in every table cell. Instead, add something like this to your style sheet: .tbblue td {background-color: #000000;}
Here’s the code for the non-CSS version:

<table bgcolor="#66ccff" border="0" cellpadding="0" cellspacing="1" width="50">
<tr>
<td bgcolor="#000000">=1=</td>
<td bgcolor="#000000">=2=</td>
</tr>
<tr>
<td bgcolor="#000000">=3=</td>
<td bgcolor="#000000">=4=</td>
</tr>
</table>

=1= =2=
=3= =4=

Posted in , | 7 Comments »

7 Responses

  1. Zocor Says:

    Passed, senks author

  2. RYErnest Says:

    Nice post u have here 😀 Added to my RSS reader

  3. Anonymous Coward Says:

    You can also but the class directly on your table, or for a one-shot bordercolour (generally not recommended) use the style attribute.
    Using attributes for styling is generally a no-no, unless there really is no other way.

  4. Valorie Says:

    I believe that is one of the most important information for
    me. And i am happy reading your article. But should commentary on few
    basic issues, The site taste is wonderful, the articles
    is actually nice : D. Just right activity, cheers

  5. danialtxhqui.pen.io Says:

    constantly i used to read smaller articles which also clear their
    motive, and that is also happening with this article which I am reading at this
    time.

  6. Rosalina Says:

    I see you don’t monetize your site, there is one cool method to make extra money, it will work with your blog perfectly, just
    search in google for: tips and tricks by Fejlando

  7. hedge basket Says:

    Interesting info. Me and my brother are trading using RobotFX EA. They are developing valuable expert advisers (FX trading software or robot fx) and valuable MetaTrader technical indicators based on fortunate forex strategies. The robotfx trading tools are well explained so each robot trading trader can understand the trading idea behind it. All RobotFX trading tools are also available as demo version that anyone can download for free.
    hedge basket http://robotfx.ro/

Leave a Comment

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.