Mark Branscum
asked on
I have 3 paragraphs HTML CSS ..... wanting to choose first paragraph to make it lighter color
Below html specifically the paragraphs .... im wanting to select the first paragraph using css ..... using first-child I think ... im not sure how to do it so I can make it a lighter color .... note with out adding a class or ID to the p tag
<div class="container">
<div class="meIntro">
<p>Nulla porttitor accumsan tincidunt. Nulla porttitor accumsan tincidunt. Vivamus suscipit tortor eget felis porttitor
volutpat.</p>
<p>Nulla quis lorem ut libero malesuada feugiat. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Lorem
ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p>Proin eget tortor risus. Nulla quis lorem ut libero malesuada feugiat. Curabitur aliquet quam id dui posuere blandit.</p>
</div>
.container {
max-width: 1200px;
margin: 0 auto;
color: #ffffff;
padding: 0 20px;
}
.container::after {
content: "";
display: block;
clear: both;
}
.meIntro {
padding-top: 10px;
width: 300px;
color: #0e1012;
}
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Great answer .... clear, concise, complete..... I'll give it a go tomorrow.... can't wait .... first-of-type sounds like the way to go ..... as it is possible that I may wish to add to markup .
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Sorry! I've corrected my response!
I will correct later. Apparently I can't edit responses in the phone app. Yes, I did mean nth-of-type(2).
Hmm...
Looks like we can't edit our posts anymore. Really?
Oh, well hopefully, my corrections are noticed!
Looks like we can't edit our posts anymore. Really?
Oh, well hopefully, my corrections are noticed!
ASKER
This was spot on .... not did it do what was expected the explanation was clear, concise, and complete ... couldn't ask for more
http://jsbin.com/nugedavacu/edit?html,css,output
this is "start at the div with class meIntro and get all the p elements but stop at the first"
Open in new window