Понекад може бити пожељно уклонити горњу или леву маргину са првог елемента у контејнеру. Исто тако, десна или доња маргина од последњег елемента у контејнеру. То можете учинити ручном применом класа на ХТМЛ:
.first ( margin-top: 0 !important; margin-left: 0 !important; ) .last ( margin-bottom: 0 !important; margin-right: 0 !important; )Нулирање „горње“ / „доње“ корисно је са вертикалним низом елемената, нулирање „лево“ / „десно“ корисно за хоризонталне редове (уопште). Али ... овај метод зависи од тога да ли сами додате класе у ХТМЛ. Псеудо-селектори могу бити бољи, мање наметљив начин:
* > :first-child ( margin-top: 0 !important; margin-left: 0 !important; ) * > :last-child ( margin-bottom: 0 !important; margin-right: 0 !important; )Можда ћете желети да замените * специфичнијим бирачима према вашим потребама.
„Сваки трећи“ итд.
Претпоставимо да сте имали плутајући блок од 9 елемената, 3 са 3. Врло је често да ћете можда требати уклонити десну маргину из 3., 6. и 9. предмета. Ту би могао да вам помогне псеудо-селектор н-тог детета:
* > :nth-child(3n+3) ( margin-right: 0; )Једначина тамо, 3н + 3, делује овако:
(3 × 0) +3 = 3
(3 × 1) +3 = 6
(3 × 2) +3 = 9
итд.
јКуери
јКуери користи ЦСС3 селекторе, који укључују: фирст-цхилд,: ласт-цхилд и: нтх-цхилд (). То значи да ће у прегледачима који не подржавају или не подржавају у потпуности ове бираче, РАДИТИ ће у јКуерију, тако да ЦСС подршку можете заменити подршком за ЈаваСцрипт. На пример:
$("* > :nth-child(3n+3)").css("margin-right", 0);Подршка прегледача
: фирст-цхилд и: ласт-цхилд ради у најновијем издању свих главних прегледача, али не и у ИЕ 6.: фирст-цхилд је подржан у ИЕ 7+. : нтх-цхилд ради у Сафари 3+, Фирефок 3.5+ и Цхроме 1+, али и даље не ради у ИЕ8.
Такође погледајте чланак Давида Оливера.