Apply class when second item in the listing

Question

Apply class when second item in the listing

Navigation

#1 by (1 votes)

0

I have the following HTML code:

<ul class="grid_1330 margin-auto">
  <li class="homeListagemLi">
    <div class="homeListagemDiv">
       <ul>
         <li><img src="./imagens/pessoa.jpg" height="220" width="220" /></li>
         <li><span>teste1</span></li>
         <li><span>teste2</span></li>
         <li></li>
         <li></li>
         <li></li>
         <li></li>
        </ul>
     </div>
   </li>
</ul>

So here's my CSS:

.homeListagemDiv>ul>li>img{width: 220px;height: 220px;}
.homeListagemDiv>ul>li>span{
    color: #00aeef;
    font-size: 15px;
    font-family: "open_sansbold";<sp
}

I want it when, span is the second, there inside the LI, it accepts other formatting, different from the one I put in the CSS. Of course, I could create a class and put it in li , but, does it have another way?

html css

asked by anonymous 23.07.2014 / 22:36

1 answer

Error accessing method in a class What features to use when creating a Chrome extension for notifications [closed]

score 1 · Accepted Answer

If I understood correctly what you want this element to be

   <ul>
     <li><span>teste1</span></li>
     <li><span class="esse">teste2</span></li>
   </ul>

And not so

   <ul>
     <li><span>teste1</span><span class="esse">teste1</span></li>
     <li><span>teste2</span></li>
    </ul>

You can not do it with css, in case the second example would look like this:

ul > li > span:nth-child(2) { color: red }

What you can do is take the second li, if the span is always there

ul > li:nth-child(2) > span { color: red }