CSS: kako se znebim inherited stila?

4 naročniki

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! :)