Formatting tables best practices

[Ghitulescu]

Originally Posted by Turtle91

...same concept as people using classes (<p class="para">, <blockquote class="block">, etc.). Just define the base tag, then use a class or ID for a specific deviation from the default.

If there IS a reason, I would be interested in knowing.

You will also hear that tables should only be used when you absolutely MUST... and anything larger than 2-3 columns should be re-thought as it really messes up the display on smaller screen sizes; large tables usually do better as an image.

Maybe this could enlighten you
https://www.mobileread.com/forums/sh...d.php?t=341035

[Turtle91]

Originally Posted by Ghitulescu

Maybe this could enlighten you
https://www.mobileread.com/forums/sh...d.php?t=341035

I'm not seeing how this link answers the question??

My question was:

I have seen css using "id" tags to define something specific...especially if it is used with js, but I haven't figured out if there is a point to it just to say that it is a tag... (especially since the IDs need to be unique). eg. <table id="table">

...same concept as people using classes (<p class="para">, <blockquote class="block">, etc.). Just define the base tag, then use a class or ID for a specific deviation from the default.

If there IS a reason, I would be interested in knowing.

First off - ID's need to be unique - you can't define all your tables with the id="table". You would want to use a class.

Second - it's just silly to use a class to define an element as that element. Why would you use <p class="para"> when the <p> means it is a paragraph in the first place?? You would simply define your standard/normal/default paragraph styling in your CSS, then use a class for any paragraph that is NOT standard.

p {margin:0; text-indent:1.2em} //* or whatever you want *//
p.red {font-weight:bold; color:red}

<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p class="red">This is a red, bold, paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>

The same concept applies to <blockquote class="block">, and <div class="division"> - or even worse - <div class="para">, <div class="block">.