IE-nek külön CSS tulajdonságok beállítása, hogyan értelmezzem?
Valaki segítene ezt értelmezni?
■ De az elmélet az, hogy az explórernek külön css tulajdonságokat kell adni. Erre több módszer is van, de amit lent írtam, az most a legelterjedtebb. A main.css vonatkozik minden böngészőre, és emellé kell csinálnod egy másik css-t csak az IE-nek, amit mindenképp a main.css alatt kell behívni! Ilyenkor az IE is értelmezi a main.css-t, ezért nem kell mindent újra megadni az ő css-ében, csak azokat, amiknél valamit szarul értelmez.
Na mondok egy példát. A klasszikus box model szopacs: van egy 200px széles dived (kapjon most egy 'box' id-t), 10px paddinggal és 3px borderrel, a fő css-ben így néz ki:Ez minden normális böngészőben összesen 226px széles lesz, mert a width csak az elem (vagyis a benne lévő szöveg) szélessége, a többi hozzáadódik (méghozzá kétszer, mert mindkét oldalon van a padding és a border). IE6-ban viszont az egész elem, paddinggal, borderrel együtt lesz csak 200px. Ilyenkor jön a feltételes kommenttel behívott css, amiben felül kell írnod az eredeti width értéket:
Na mondok egy példát. A klasszikus box model szopacs: van egy 200px széles dived (kapjon most egy 'box' id-t), 10px paddinggal és 3px borderrel, a fő css-ben így néz ki:
#box {
width: 200px;
padding: 10px;
border: 3px solid black;
}
#box {
width: 226px;
}
Doctype
Alábbi linket olvasd el, van ábra is a fent leírt problémáról:
The IE box model and Doctype modes