How to remove left and right margins on the first and last div

Question

I have over 100 divs per page and each row has 3 divs. I want to remove the left margin from the first div and the right edge from the right div, while the center of the div should have 15px margin left and right. Read how I can do this without defining specific classes (without fields) for each div. Here is an example

here is my css code

.prp_box{ margin:15px 15px; width:100px; height:100px; background:#5f03a6; } 

Answer 1

Check this out: http://jsfiddle.net/VHXEp/

Use the nth-child(n) CSS3 selector.

Answer 2

You can try using the css nth-child selector.

 #container:nth-child(3n+0) { margin-left: 0; } #container:nth-child(3n+3) { margin-right: 0; } 

This code may require several settings, 3n is how often, so every 3. The number after + starts when it starts

Answer 3

Check out JsFiddle

http://jsfiddle.net/kpTdE/

 .prp_box{ width:100px; height:100px; background:#5f03a6; float:left; } .sec_box { width:100px; height:100px; background:#5f03a6; float:left; margin-left:30px; } .sec3_box { width:100px; height:100px; background:#5f03a6; margin-left:260px; }