Table's and Classes - Simpler question that the one below

A

Anonymous

Guest
I asked this question earlier, but I went too far into detail.

I want to know if I can specify a class for a table so that all of the cells are formatted the same, except for certain cells I want to format with another class.

Ex.

Table w/ class of menu
-----------------------
cell 1 heading section 1 w/ class of menu-title
-----------------------
cell 2 - section 1 option 1
-----------------------
cell 3 - section 1 option 2
-----------------------
cell 4 heading section 2 w/ class of menu title
-----------------------
cell 5 - section 2 option 2
-----------------------
etc.
-----------------------

The idea is that all the cells would be formatted with the class of menu and the headings would be formatted with the class of menu-title.

I have achieved the look that I want by specifying the class for each cell, its extra code, but it works. If there is a way to do it like I want, please let me know.

Below is the code I am using by specifying a class for each cell:
(I also have a class for specifying the width of the table)
Code:
<div id="navmenu">
<table class="nav" summary="Navigational Menu">
 <tr>
  <td class="menu-title">Departments</td>
 </tr>
 <tr>
  <td class="menu"><a href="/">Home</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/calendar/">Calendar</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/programs/">Lodge Programs</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/howl/">The Howl</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/leadership/">Leadership</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/committees/">Committees</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/troop_rep/">Troop OA<br />Reps Corner</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/resources/">Resources</a></td>
 </tr>
 <tr>
  <td class="menu"><a href="/links/">Links</a></td>
 </tr>
 <tr>
  <td class="menu-title">Upcoming Events</td>
 </tr>
 <tr>
  <td class="menu2"><a href="/events/">Overview of Events</a></td>
 </tr>
 <tr>
  <td class="menu-title">Website Stuff</td>
 </tr>
 <tr>
  <td class="menu3"><a href="/sitemap/">Site Map</a></td>
 </tr>
 <tr>
  <td class="menu3"><a href="/updates/">Updates</a></td>
 </tr>
 <tr>
  <td class="menu3"><a href="/mailinglists/siteupdate/">Updates Mailing List</a></td>
 </tr>
 <tr>
  <td class="menu3"><a href="/intheworks/">In the Works</a></td>
 </tr>
 <tr>
  <td class="menu3"><a href="/submit/">Submissions</a></td>
 </tr>
 <tr>
  <td class="menu3"><a href="/feedback/">Feedback</a></td>
 </tr>
 <tr>
  <td class="menu3"><a href="/webmail/">Webmail</a></td>
 </tr>
 <tr>
  <td class="menu3">Hits!</td>
 </tr>
</table>
</div>
 
hi digital,

i know it may seem like extra code to put in the class definition for each cell, however i think this is the way you can avoid any headaches in the future.

also, a quicker way of doing it would be like this (this would only work if you dont use a table outside the menu)...

td{
definitions....
}

this way you dont have to specify a class for each cell, it automatically displays it with whatever is in td{ }... however, you would still have to class specify your "menu titles" since these cells are different, example:

<style>
td{
text-align: right
}
td.title{
font-weight:bold;
text-align:left;
}
</style>

<tr><td class="title">Item List Name</td></tr>
<tr><td>List Item</td></tr>

hope that explanation doesnt confuse you...
 
Thank's

That is pretty much what I thought. I am going to need more tables though, so I will stick to doing it like I did it.

Thanks Again! :D
 
Back
Top