grouping and nesting selectors

[sajisweetgirl 0]

HiI just started learning css from w3schools tutorials ,I have a question in chapter nesting selectors .in this style p{..............} .marked{...................} .marked p{...............} p.marked{................} whats the difference between 'p.marked' and '.marked p' ?!

thanks

[niche 141]

See the try-it-yourself at:http://www.w3schools.com/css/css_grouping_nesting.asp If you already have, what is it about the try-it-yourself that you didn't expect?

[sajisweetgirl 0]

I checked it !i know that p means paragraph tag and .marked is a class and p.marked is all paragraphs with the class marked , but whats .marked p? when do you use it?

[sajisweetgirl 0]

.marked p means all paragraphs in all element with class marked? Is that right?

[niche 141]

A third style is specified only for p elements within elements with class="marked". EDIT: You must look at the HTML also.

Edited June 25, 2013 by niche

[jeffman 86]

.marked p corresponds to the nested <p> element in either of these HTML structures:

<p class="marked">   <p>First descendent</p></p> <div class="marked">   <table>	  <tr>		 <td>			<p>Arbitrary descendent</p>		 </td>	  </tr>   </table></div>

Edited June 25, 2013 by Deirdre's Dad

[dsonesuk 925]

paragraph within another paragraph element is invalid, bad bad example. tut tut

[jeffman 86]

paragraph within another paragraph element is invalid, bad bad example. tut tut

True. It sort of looked like OP's CSS wants to do it that way. A better example would look like this:

<div class="marked">   <p>Hello</p></div>

Edited June 25, 2013 by Deirdre's Dad

[sajisweetgirl 0]

Got it! thank you all