html - Combine css selectors with class not working -


hey guys think know rules how combine css selectors.

but isnt working.

i have css:

table,td {     border               : 1px solid #ccc;     border-collapse      : collapse;   font                 : small/1.5 "tahoma", "bitstream vera sans", verdana, helvetica, sans-serif; }  table {     border                :none;     border                :1px solid #ccc; } thead th, tbody th {     background            : #fafafb;   color                 : #666;       padding               : 5px 10px;   border-left           : 1px solid #ccc;   border-bottom            : 1px solid #ccc; } tbody th {   background            : #fafafb;   border-top            : 1px solid #ccc;   text-align            : left;   font-weight           : normal; }  #middletable {   background            : #fafafb;   border-top            : 1px solid #ccc;   text-align            : center;   font-weight           : normal; } tbody tr td {     padding               : 5px 10px;   color                 : #666; } 

i want specify it, rules working in 1 class.

so put class "greytable" table tag

<table class="greytable"></table> 

after tryed put selector css this:

table.greytable, .greytable td {     border               : 1px solid #ccc;     border-collapse      : collapse;   font                 : small/1.5 "tahoma", "bitstream vera sans", verdana, helvetica, sans-serif; }  table.greytable {     border                :none;     border                :1px solid #ccc; } .greytable thead th, .greytable tbody th {     background            : #fafafb;   color                 : #666;       padding               : 5px 10px;   border-left           : 1px solid #ccc;   border-bottom            : 1px solid #ccc; } .greytable tbody th {   background            : #fafafb;   border-top            : 1px solid #ccc;   text-align            : left;   font-weight           : normal; }  #middletable {   background            : #fafafb;   border-top            : 1px solid #ccc;   text-align            : center;   font-weight           : normal; } .greytable tbody tr td {     padding               : 5px 10px;   color                 : #666; } 

but isnt working. can show me wrong , how work?

here fiddle: http://jsfiddle.net/hyabq/

ok, pretty basic stuff. have created example you.

in simple demo have 2 tables, want style first one. give class or id , using give table styles. same else really, table has class test don't need try , table again e.g: .test table selecting it.

from first table class test styled, whereas second not touched due not having class test.

have @ fiddle , play around it, hope helps.

html:

only 1 affected <table class="test">     <tr>         <th>test</th>         <th>test</th>         <th>test</th>     </tr>     <tr>         <td></td>         <td></td>         <td></td>     </tr> </table>  table not <table>     <tr>         <td></td>         <td></td>         <td></td>     </tr> </table> 

css:

.test th {     width: 100px;     border: 1px solid;     font-size: 10px; } .test td {     border: 1px solid;     height: 100px; } 

demo here


Comments

Popular posts from this blog

Android layout hidden on keyboard show -

google app engine - 403 Forbidden POST - Flask WTForms -

c - Why would PK11_GenerateRandom() return an error -8023? -