Как убрать лишний отступ

[alleclf]

Есть 3 блока по 50 пх и отступом между ними 10 пх.

Как их засунуть в другой блок размером 50+50+50+10+10 = 170 пх

 

Главная проблема в том, что все внутренние блоки одинаковые - никак нельзя их различить по классу или id.

 

Вот пример, http://jsfiddle.net/EDAT8/

тут блок 180 пх - на 10 пх больше, так как мешает лишний отступ.

[Aleksandr.L]

Отступ у последнего уберите и задайте ширину 170px. Если я правильно понял.

.cont :last-child { margin-right: 0 }

Но можно сделать проще, не задавая ни ширины, ни высоты родителю: http://jsfiddle.net/EDAT8/1/

 

Edited March 31, 2014 by Aleksandr.L

[p.max]

.cont :last-child { margin-right: 0 }

К сожалению last-child не кроссбраузерно. Лучше использовать first-child.

И писать нужно слитно .cont:last-child но скорее всего это у вас просто опечатка))

[Aleksandr.L]

Писать нужно раздельно. Слитно можно было бы написать вот так:

.block:last-child { margin-right: 0 }

[alleclf]

да мне в принципе без разницы что использовать last-child или first-child, просто отступ установить с другой стороны

 

Большое спасибо, опробую на практике.

[Q4Dizzy]

Берите в учёт, что last:child и :first-child не поддерживаются ИЕ 8  и ниже. потому для них нужно использовать javascript/jquery

[p.max]

Берите в учёт, что last:child и :first-child не поддерживаются ИЕ 8 и ниже. потому для них нужно использовать javascript/jquery

first-child поддерживает ie8, а вот last-child нет.