SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Guru DeNasio's Avatar
    Join Date
    May 2001
    Posts
    830
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Table attributes deprecated

    On W3schools.com I read the following about the table atributes:

    align - Not supported in HTML5. Deprecated in HTML 4.01.
    bgcolor - Not supported in HTML5. Deprecated in HTML 4.01.
    cellpadding - Not supported in HTML5.
    cellspacing - Not supported in HTML5.
    width - Not supported in HTML5.

    What does this all mean? Does this mean that if I build my website using <!DOCTYPE html> (HTML5) that these attributes won't work?
    Ballot-Box.net - free polls for webmasters
    FormLog.com - free form processor

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    It means that CSS now provides that information about the table - allowing you to specify different values for different types and sizes of device on which the page can be viewed.

    Deprecated means obsolete and no longer to be used and that support for the command may be completely removed at any time.

    So in 1997 when HTML 4 was released people were advised to stop using those attributes and to use CSS instead. At this point you have had 16 years to replace those attributes so there are no real excuses for still using them.

    They will still work with <!DOCTYPE html> (HTML 2+) but only for as long as browsers continue to support HTML 3.2 and earlier versions of HTML.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Guru DeNasio's Avatar
    Join Date
    May 2001
    Posts
    830
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok I get it. The thing is, I have a table layout using cellpadding and cellspacing. But I can't seem to get the same layout when using css instead of these attributes. And I want the layout to be just like when I'm using cellpadding and cellspacing. That's my problem!
    Ballot-Box.net - free polls for webmasters
    FormLog.com - free form processor

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,319
    Mentioned
    462 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by DeNasio View Post
    I can't seem to get the same layout when using css
    Post an example of what you have, and maybe a screen shot of how you want it to look. If you do post code, please make it a readily usable example, as outlined here: http://www.sitepoint.com/forums/show...Posting-Basics

  5. #5
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,892
    Mentioned
    123 Post(s)
    Tagged
    1 Thread(s)
    Also, don't panic! A lot of browsers will do their best to interpret what they think you meant, so although it is not technically correct to use those attributes, it's unlikely that (m)any browsers will choke on it and not display the table as you intended.

    But, as Ralph says, you should be able to recreate any HTML table attributes in CSS, so let us know what bit you're having trouble with.

  6. #6
    SitePoint Guru DeNasio's Avatar
    Join Date
    May 2001
    Posts
    830
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My websites are offline at the moment so I cannot show you the difference on a webpage. But I can show you it with pics.

    The code that I've used for years is the following:

    Code:
    <table bgcolor="#006633" cellspacing="1" cellpadding="2" border="0" width="150">
    <tr bgcolor="#006633"><td align="center">Header</td></tr>
    <tr><td bgcolor="#ffffcc" align="left">Body 1<br /><br /><br /></td></tr>
    <tr><td bgcolor="#ffffcc" align="left">Body 2<br /><br /><br /></td></tr>
    </table>
    This code produces the table you guys see in the pic named "Example attr.gif".

    I've changed the table attributes into css attributes in the following code:

    Code:
    <table bgcolor="#006633" border="0" style="width:150px;border-spacing:1px 1px 1px 1px;padding: 2px 2px 2px 2px;">
    <tr bgcolor="#006633"><td align="center">Header</td></tr>
    <tr><td bgcolor="#ffffcc" align="left">Body 1<br /><br /><br /></td></tr>
    <tr><td bgcolor="#ffffcc" align="left">Body 2<br /><br /><br /></td></tr>
    </table>
    But this gives another layout, see de pic "Example css.gif".
    Attached Images Attached Images
    Ballot-Box.net - free polls for webmasters
    FormLog.com - free form processor

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,319
    Mentioned
    462 Post(s)
    Tagged
    8 Thread(s)
    This will do the job nicely:

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <style>
    
    table {width: 150px; border-collapse: collapse;}
    th, td {padding: 2px; border: 1px solid #006633;}
    th {background: #006633; font-weight: normal;}
    td {background: #ffffcc;}
    
    </style>
    </head>
    <body>
    
    <table>
    <tr><th>Header</th></tr>
    <tr><td>Body 1<br /><br /><br /></td></tr>
    <tr><td>Body 2<br /><br /><br /></td></tr>
    </table>
    			
    </body>
    </html>

  8. #8
    SitePoint Guru DeNasio's Avatar
    Join Date
    May 2001
    Posts
    830
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks! It works perfectly!
    Ballot-Box.net - free polls for webmasters
    FormLog.com - free form processor


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •