Imam jedan problem sa nasljeđivanjem CSS pravila za font-size koji nikako da riješim (pa ću pokušati dati što više informacija ovdje).
Koristim ovaj doctype u HTMLima (koje generiram iz PHPa):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
...
</html>
Probao sam inače i sa: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Prvi CSS koji linkam je reset.css (v2.0) koji u vrhu ima ovo:
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
zatim linkam svoj CSS koji ima iste selectere ali je sama definicija ovakva:
html, ..., (isto kao gore), ..., textarea {
font-size: 11pt;
line-height: 110%;
font-family: Arial,sans-serif;
}
u svom CSSu također imam predefinirane stilove za veličine fontova koje želim forsirati po nekim elementima:
.fs150, .fs150 * { font-size: 125% !important; }
.fs140, .fs140 * { font-size: 120% !important; }
.fs130, .fs130 * { font-size: 115% !important; }
.fs120, .fs120 * { font-size: 110% !important; }
.fs110, .fs110 * { font-size: 105% !important; }
.fs100, .fs100 * { font-size: 100% !important; }
e sad dolazimo do problema sa tablicama i pod-elementima ... recimo da imam tablicu:
<table class="fs110">
<tr>
<td class="fs150">ovdje želim veći font</td>
</tr>
<tr>
<td>ovdje želim font po fs110</td>
</tr>
<tr>
<td>ovdje želim font po fs110</td>
</tr>
<tr>
<td>ovdje želim font po fs110</td>
</tr>
</table>
U ovom slučaju mi se klasa fs150 na TD elementu ignorira! Ako definiciju u CSS-u imam bez .fs150 * selectora, onda se ignorira fs110 na TABLE elementu (odnosno nema nikakvog nasljeđivanja "na dolje").
Što hoću dobiti? Pa jednostavno nasljeđivanje - dakle da ako na TABLE elementu zadam fs110 da on važi za sve pod-elemente, ali ako negdje specifično zadam drugu klasu, da se to lokalno i iskoristi.
Naravno - imam i tablice unutar tablica, DIVove unutar TD elemenata na koje se također mora naslijediti font od parenta i tako dalje
(btw. ovo nije webica već se HTML report - zato TABLE - da netko ne pomisli da radim web dizajn s tablicom ;))
Da li se radi o tome što reset i moj CSS prvo direktno definira font na TD (i svim ostalim) elementima? Može li se dobiti isti efekt na drugi način - dakle da se forsira inicijalna vrijednost a kasnije se lako CSS klasom promijeni?
Ako netko ima ideju zašto mi ovo nasljeđivanje nikako neće proraditi - ima pivu, dvije + vječnu zahvalnost od lika koji je totano izluđen ovim problemom :)