Mohamed Serag Mohamed Serag - 20 days ago 8
CSS Question

Styling <p> tag inside <div> by using CSS

(HtMl)

<div>
<h2>I am another awesome h2</h2>

<p>number one paragraph</p>

<p>I'm the second paragraph inside this div!</p>
</div>

<p>PARAGRAPH NOT INSIDE A DIV</p>


<div>
<h2>A less awesome h2</h2>

<p>number one</p>

<p>One last paragraph here!</p>
</div>


(CSS)

I tried to use nth-of-type and nth-child but I cannot choose the two P element inside SECOND DIV.

Can anyone help?

Note: I have too many P tag and DIV inside my webpage. I want to choose those without using class or id.

Answer

the selectors are pretty simple if you want to select all p element try below

div p {background:yellow}

if you want to select the second p element in every div try below

div p:nth-child(2) {background:yellow}
div p:last-child {background:yellow} /*only when you got 2 p elements*/
div p:nth-of-type(2) {background:yellow}
Comments