CSS: kako se znebim inherited stila?

Za več p-tagov uporabljam enak stil, ki ga glede na druge elemente rahlo spreminjam.

Nekako takole:

p.pink {

color: #ffffff;

position: absolute;

}

div.haha p.pink {

top: 0;

left: 0;

}

div.haha p.pink.right {

top: 0;

right: 0;

}

HTML:

<div "bla">

<p class="pink">Nekaj</p>

</div

<div class="haha">

<p class="pink">Nekaj</p>

</div

<div class="haha">

<p class="pink right">Nekaj</p>

</div

Tukaj imam dva diva z enakim classom in znotraj je omenjeni P tag. Zdaj fora je v tem da je P v prvem "haha" divu pozicioniran na skrajno levo, v drugem pa bi ga rad postavil skrajno desno. Ampak pač ne gre in mi iz stila "div.haha p.pink" deduje left:0 ki pa ga tukaj ne rabim in se ga želim znebit. Ne morem mu pa npr nastavit left:none.

Nakoncu ima ta P tag nastavljen left:0 in right:0, kar ga raztegne čez cel div, tega pa nočem. Text-align mi tukaj ne pomaga.

Obstaja kakšna rešitev poleg tega, da za dotični P tag naredim specifičen p.pink-r (trenutna rešitev, pri kateri sem sedaj)?

probaj z:

p.pink.right {

right: 0 !important;

left: auto !important;

top: 0;

position: absolute;

}

(!important izniči inherit)

ali:

p.pink.right {

display: inline-block;

float: right;

position: relative;

}

O najlepša ti hvala, left: auto je rešil problem!

Kul, glad to help :)

p.s. če bo v ie6/7 še vedno metalo na levo, dodaj position: absolute.

Preden si zapacaš css z !important deklaracijami, poskusi preprosto odstranit left: 0 iz div.haha p.pink {}

preberi si o tem, kdaj imajo kaksni razredi prednost... najprej je pomembno po kaksnem vrstnem redu jih deklariras v css datoteki...kot ti pa je ze Daz povedal, uporabi !important opcijo, ki vedno povozi vse predhodne.... ampak s to opcijo moras ravnati preudarno, ker ce ne izgubi C v CSS dejansko svoj smisel

Hvala, sem uporabil samo "left: auto" in deluje (brez uporabe !important). Se izogibam uporabi !important kolikor je le mogoče! :)