Hello Experts

Hope all of you're doing well.

 

I have a HTML... See the link of image in my DropBox.

https://dl.dropboxusercontent.com/u/12360312/ss.jpg

 

I have given a margin-right:7px to each image.... Obviously the last YouTube image also has that margin which I dont want.

 

 

So how can I remove the margin from the last image (YouTube icon?)

 

Thank you

 

Here is the CSS if you want to look at:

 

 

.social_icons {
    width:100%;
}


.social_icons img {
    width:35px;
    height:35px;
    margin-right:4px;
}
 

 

 

There are a few ways to achieve this. Take a look at this article, it's pretty comprehensive and covers exactly what you're trying to do.

Hmmm I have seen it but I don't understand it.

 

In my case (in my CSS) what code shall I use?

OK

so in my case is this correct?

 

 

.social_icons img:last-child {margin-right:0;}
 

Basically this.

 

The last-child selector is supported in IE9+, the first-child selector is IE7+, so you could always do the opposite padding like this if browser support is a concern.

Thank you Meow

The easiest way is to write a new css elemnt and only style the last youtube image - Make the margin right property for the last image as 0 px, that's all.

 

To be honest with you, I cannot open the link you list here, it gives me a 404 error.

The easiest way is to write a new css elemnt and only style the last youtube image - Make the margin right property for the last image as 0 px, that's all.

 

To be honest with you, I cannot open the link you list here, it gives me a 404 error.

Hi Thank you for your response.

 

Yeah, I removed the link.

 

Well your soln. will work in a static website but not on a dynamic website.

 

Last child or nth css are perfect in these case.

 

Thank you