How do you give a <p> tag element inside a third <div> tag element in an HTML source code a background color in using CSS Selectors?
-
2yeah, where is the code?soorapadman– soorapadman2016-07-15 15:12:33 +00:00Commented Jul 15, 2016 at 15:12
Add a comment
|
1 Answer
You can use the :nth-child() selector for this.
.container div:nth-child(3) p {
color: red;
}<div class="container">
<div>
<p>Hello</p>
</div>
<div>
<p>I'm</p>
</div>
<div>
<p>Bob</p>
</div>
</div>9 Comments
Edward Osei-Nyarko
Well solution is great buh the changes affected just the first paragraph tag element instead of both of them....I'm sorry I should have added that lil info earlier when asking my question
Edward Osei-Nyarko
The division element has no class and I'm new here so i don't even know how to approve your answer on this platform unless I add an approval comment under it.
Edward Osei-Nyarko
Well i just discovered I made an error typing my HTML source code at that particular division element i forgot to type the second paragraph tag element buh I have done that now... About your solution code you typed... Just remove the "container" class cause the division tag elment in my source code has no class
Hunter Turner
Since you did not provide your code in the question, I just had to guess with the HTML structure. Just replace
.container with whatever div is containing your multiple divs. Otherwise, if you just say, div:nth-child(3), it will select the third child of every div on your page.Hunter Turner
It's probably best if you create a new question instead of asking one in the comments. That way, if someone else has the same problem, they can quickly find a question relating to it. But this time please post some relevant code so that the developers can help you more efficiently.
|