ugrás a tartalomhoz

CSS validság és div problémák IE vs FF

Raziel Anarki · 2006. Május. 11. (Cs), 15.43
sziasztok!

(lehet hogy ezt nem új témának kellet volna, de attól tartottam elveszett volna a másikban, meg nem is 100% kapcsolódó)

épp az oldalam css-ét szerettem volna validálni, és ehhez kapcsolódan lenne egy kérdésem:

észrevettem h IE ben és FFben másképp viselkednek a diveim, még akkor is ha strict doctypet választok (a másik topicban írtátok h akkor jónak kéne lennie)

IE-ben javítottam a hibát a "_width" technikával, de azt szeretném elérni h le tudjam validálni a css-emet.

van esetleg egy másik technika, ami validálható?

itt egy kép
a kék csíkok h2-ők border-bottom -jai, pirossal rárajzoltam a különbséget:
a világosabb content div valamiért 3 pixellel szélesebb, a sidebar div oldalán a +1 pixelt ne nézzétek, én számoltam el a csst :)

legjobb tudomásom szerint nincs semmi a tartalomban ami így kinyomhatná a content divet, bár nem vagyok IE szakértő :)

(az oldalam egyébként XHTML 1.0 Strict, és a w3c szerint valid)

2es kérdés: van valami ötletetek a min-height/_height dologra is? (lásd css)
(ahogy észrevettem IE ben a height viselkedik min-height -ként...)

a kérdéses divek, plusz ami az egészet tartalmazza, és az "alap" div css-e:

div
{
    padding: 0;
    margin: 0;
}

div.wrapper /* ebbe van az egész */
{
    width: 762px;
    margin: 0 auto;
    padding: 0;
    border: 1px solid black;
    background-color: #ccd;
}

div.content /* balodali */
{
    padding: 4px;
    float: left;
    border-right: 1px solid black;
    background-color: #dde;

    width: 595px;
    min-height: 500px;

    _width: 591px;   /* ezektől akarok megszabadulni */
    _height: 500px;
}

div.sidebar /* jobboldal */
{
    padding: 4px;
    width: 150px;
    float: right;
    background-color: #ccd;
}

h2 /* itt van ez is hátha itt csináltam valamit rosszul */
{
    border-bottom: 1px solid #248;
    padding: 0 0.5em;
    margin: 0;
    font-size: 1.4em;
}
‹ Böngésző független CSS kialakítás lehetséges? Magyarországon 800x600 vagy 1024x768? ›
 ■
1

Conditional comments

janoszen · 2006. Május. 11. (Cs), 16.30
Conditional commentekkel meg tudod oldani.
2

utánanéztem...

Raziel Anarki · 2006. Május. 11. (Cs), 17.05
...és én is valami ilyesmire gondoltam csak css-en belül.

nem szeretnék csak ezért a 2 sorért alternatív css-s kiszolgálni, főleg, hogy a css fájl az oldalon egy formban választható.

bár megoldható lenne, ennyit nem ér meg az a css valid logo sztem :)

a +3 pixelre van valakinek valami ötlete?
3

Lehet

janoszen · 2006. Május. 11. (Cs), 17.24
Ez kell neked:

* html selector


Ez kiválasztja csak az IE-s selectort.
4

köszi

Raziel Anarki · 2006. Május. 11. (Cs), 17.53
nem gondoltam volna, hogy ilyen egyszerű :)

tudsz esetleg valami linket adni ahol találok ehhez bővebb leírást?
5

pl

toxin · 2006. Május. 11. (Cs), 18.40
http://www.info.com.ph/~etan/w3pantheon/style/starhtmlbug.html
6

kösz

Raziel Anarki · 2006. Május. 11. (Cs), 18.45
wow egy hasznos ie bug :lol:

kösz a segítséget még1x
7

zizi

vbence · 2006. Május. 12. (P), 02.13
Először is:
nem kell hack-eket használni, sem pedig két külön css-t, úgy kell írni, hogy működjön.

A "min-height"-re egy primitív megoldás: tegyél bele egy float:right-os divet a tartalomba:

<div style="min-height: 100px">
    Blah
</div>
... helyett ...

<div>
    <div style="display:inline; float: right; height: 100px;"></div>
    Blah
</div>
Ez nagy valószínűséggel működik, de fenetudja. Nem szép, de nem hack, és nem kell 2x dolgozni.
8

float az blokk és kilóg

Jano · 2006. Május. 12. (P), 03.42
Ha egy szülő elem nem floatolt vagy nem overflow:auto tulajdonsagu akkor a benne levő floatolt elem kifog lógni belőle! Egy float automatikusan blokk tulajdonságúvá vállik az inline megadás szabványos böngészőkben hatástalan lesz, IE-ben meg megszüntet pár bugot.

Szóval min-height megoldására ez így nem általános megoldás.