Board index   FAQ   Search  
Register  Login
Board index php forum :: HTML CSS

class in a class?

Questions and tutorials related to Cascading Style Sheets *all versions*

Moderators: macek, egami, gesf

class in a class?

Postby digitalgravy » Wed May 28, 2003 2:19 pm

I have a table for a navigational menu.

I have set up a few classes, for the different sections of a table that will make up the nav menu.

I have the styles set up properly. They are as follows:
The following code is for the menu items

Code: Select all

.menu td {
   background-color: #900;
   border: .5px solid white;
   border-spacing: 0px;
   padding-left: 4px;
}
.menu {
   background-color: white;
   color: #FFFFFF;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 10pt;
   font-weight: normal;
}

.menu a:link {
   color: #FFFFFF;
   text-decoration: none;
}

.menu a:visited {
   color: #FFFFFF;
   text-decoration: none;
}

.menu a:hover {
   color: #FF0000;
   text-decoration: none;
}

.menu a:active {
   color: #FFFFFF;
   text-decoration: none;
}

.menu a:focus {
   color: #FF0000;
}



The following is for the Menu section headers:

Code: Select all
.menu-title td {
   background-color: #000;
   color: #fff;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 10pt;
   font-weight: bold;
}


I have set these up this way because I want to have borders around each cell.

I have the code in my html to display the menu, but It doesn't work properly:
Code: Select all
<table width="100"  class="menu">
 <tr class="menu-title">
  <td height="20">Departments</td>
 </tr>
 <tr>
  <td><a href="/">Home</a></td>
 </tr>
 <tr>
  <td><a href="/calendar/">Calendar</a></td>
 </tr>
 <tr>
  <td><a href="/programs/">Lodge Programs</a></td>
 </tr>
 <tr>
  <td><a href="/howl/">The Howl</a></td>
 </tr>
 <tr>
  <td><a href="/leadership/">Leadership</a></td>
 </tr>
 <tr>
  <td><a href="/committees/">Committees</a></td>
 </tr>
  <td><a href="/troop_rep/">Troop OA<br />Reps Corner</a></td>
   <tr>
  <td><a href="/resources/">Resources</a></td>
 </tr>
 <tr>
  <td><a href="/links/">Links</a></td>
 </tr>
</table>
</div>



The section heading displays the text in bold, but it has the same padding on the left and the color from the rest of the menu.

I want the header to be black like the style specifys. How should I modify the code? I have the "menu_title" in a cell, but it is in the table where the "menu" class is specified. I think its cancelling itself out.

You can see the file I am talking about at http://jacob.digitalgravy.net/

I am rebuilding a site to be valid xhtml. I have the original menu that I am trying to create made up of a table, and I'm trying to do the whole xhtml/css thing. You can see the original menu at http://www.spe-le-yai.org, this is how I want it to look.

Any help would be appreciated.
User avatar
digitalgravy
New php-forum User
New php-forum User
 
Posts: 32
Joined: Sat Feb 15, 2003 10:00 pm
Location: Los Angeles, CA

Postby liquedus » Wed May 28, 2003 5:34 pm

the way styles flow are like this

<tag1><tag2>Hello</tag2></tag1>

if the same elements are changed by tag2 that were initialized with tag1, then you will not see the styles caused by tag1.

also i notice that you make tr class specific:

<tr class="menu-title">
<td height="20">Departments</td>
</tr>

im not 100% sure, but i dont think that applying styles to tr will not do anything, apply them to td tag

if that didnt answer your question let me know.
liquedus
php-forum Active User
php-forum Active User
 
Posts: 266
Joined: Tue Apr 08, 2003 5:18 am
Location: Ottawa, Canada

Postby Redcircle » Wed May 28, 2003 5:53 pm

one thing that I noticed is that you have the border set to .5px which cannot be done. you need to have it set to an whole number. so it is probably defaulting to 1 if you have a 1px border on every <td> then one <td> stacked on another <td> will give it a 2px between the two <td>'s
User avatar
Redcircle
Moderator
Moderator
 
Posts: 830
Joined: Tue Jan 21, 2003 10:42 pm
Location: Michigan USA

Postby digitalgravy » Thu May 29, 2003 8:23 am

I will play around with a few things, I think, Ill just specify a class to each individual cell.

-Thanks
User avatar
digitalgravy
New php-forum User
New php-forum User
 
Posts: 32
Joined: Sat Feb 15, 2003 10:00 pm
Location: Los Angeles, CA

Postby WiZARD » Sat May 31, 2003 12:17 am

Hi digitalgravy!
i'm propose to you use TopStyle programm very good!
and once more to you i'm propose do next:
first than you create new style do like that:
Code: Select all
TD.wrd1{color:#00ff00;}
TD.wrd2{color:#ff0000;}

and in HTML do next:
Code: Select all
<TABLE>
<TR>
<TD colspan="3" align="center" class="wrd1">Hello World!</TD>
<TD colspan="3" align="center" class="wrd2">Hello World!</TD>

</TR>
.............

but in that situation it's model work under IE not more
User avatar
WiZARD
Moderator
Moderator
 
Posts: 1257
Joined: Thu Jun 20, 2002 10:14 pm
Location: Ukraine, Crimea, Simferopol

Postby digitalgravy » Tue Sep 07, 2004 2:28 pm

I have decided to go with a list instead of the tables.
User avatar
digitalgravy
New php-forum User
New php-forum User
 
Posts: 32
Joined: Sat Feb 15, 2003 10:00 pm
Location: Los Angeles, CA

Postby swirlee » Tue Sep 07, 2004 4:57 pm

digitalgravy wrote:I have decided to go with a list instead of the tables.


A very good idea. :D
User avatar
swirlee
Moderator
Moderator
 
Posts: 2272
Joined: Sat Jul 05, 2003 1:18 pm
Location: A bunk in the back


Return to CSS

Who is online

Users browsing this forum: No registered users and 2 guests

Sponsored by Sitebuilder Web hosting and Traduzioni Italiano Rumeno and antispam for cPanel.