CODEWITHSUNDEEP
htmlcsscss-selectors
Chris.locke
Chris.locke

Reputation: 79

Why is my padding left not being removed with last-child?

No matter what i try the padding-right cant be removed using lastchild i tried using imglastchild then lilastchild also last-of-type.

 <div class="Social_Media">
        <ul>
        <li><img src="Social/facebook.png"></li>
        <li><img src="Social/twitter.png"></li>
        <li><img src="Social/youtube.png"></li>
        <li><img src="Social/googleplus.png"></li>
        <li><img src="Social/linked.png"></li>
        </ul>
    </div>

 .Social_Media ul{
padding-top:10px;
float:right;}

.Social_Media li{
display:inline;}


    .Social_Media img{
    padding-right:25px;
    background-color:red;
}
.Social_media img:last-child {
     padding-right:0px
}

Upvotes: 0

Views: 32

Answers (1)

j08691
j08691

Reputation: 207901

You have multiple typos in the code you posted (see my comment above), however the real issue is that you're selecting the wrong element. Your final selector should be

.Social_Media li:last-child img {
    padding-right:0px
}

jsFiddle example

You need to select the last list item with :last-child and then the image within it and remove the padding. Using :last-child on the image would actually apply to every image in your example as they're all the last child of their parent container.

Upvotes: 2

Related Questions