If I have a selector like
#myTable tr td .someClass{....}
Does this someClass refer "ONLY" to td having that class OR does it refer to any child of td having "someClass" ? So Is it same as ;
#myTable tr td.someClass{....}
Basically my question is does the space after td make any difference?
#myTable tr td .someClass{....} refers to any element with a class of someClass that is inside a td tag, that is inside a tr tag, that is inside an element with an id of myTable.
#myTable tr td.someClass{....} refers to a td tag with a class of someClass, that is inside a tr tag, that is inside an element with an id of myTable.
Yes, the space makes a difference:
td.someClass {...} //Refers to a table cell with the class someClass
td .someClass {...} //Refers to an element with the class someClass that is a descendant of a table cell
The former selector refers to an element of class someClass that's a descendant of a td.
To refer to a td element of class-name someClass use the latter selector.
The space is a descendent selector; if you want an immediate child (no elements between the td and the .someClass element) use >:
#myTable tr td > .someClass{....}
A space separate children from parent. Without the space you are telling the CSS to find an element with that class instead.
Yes:
The space does make a difference. The first selector selects any element with the class someClass that is a child of a td in a tr in myTable.
The second selects any td with the class someClass that is a child of a tr in myTable
The space after the tddoes make a difference
css:
#myTable tr td.someClass{ color:brown; }
#myTable tr td .someClass{ color:red; }
html:
<table id="myTable">
<tr>
<td class="someClass">
cofee
<span class="someClass">
wine
</span>
</td>
</tr>
cofee will appear brown, and wine red.
