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:
  1. div  
  2. {  
  3.     padding: 0;  
  4.     margin: 0;  
  5. }  
  6.   
  7. div.wrapper /* ebbe van az egész */  
  8. {  
  9.     width: 762px;  
  10.     margin: 0 auto;  
  11.     padding: 0;  
  12.     border: 1px solid black;  
  13.     background-color: #ccd;  
  14. }  
  15.   
  16. div.content /* balodali */  
  17. {  
  18.     padding: 4px;  
  19.     float: left;  
  20.     border-right: 1px solid black;  
  21.     background-color: #dde;  
  22.   
  23.     width: 595px;  
  24.     min-height: 500px;  
  25.   
  26.     _width: 591px;   /* ezektől akarok megszabadulni */  
  27.     _height: 500px;  
  28. }  
  29.   
  30. div.sidebar /* jobboldal */  
  31. {  
  32.     padding: 4px;  
  33.     width: 150px;  
  34.     float: right;  
  35.     background-color: #ccd;  
  36. }  
  37.   
  38. h2 /* itt van ez is hátha itt csináltam valamit rosszul */  
  39. {  
  40.     border-bottom: 1px solid #248;  
  41.     padding: 0 0.5em;  
  42.     margin: 0;  
  43.     font-size: 1.4em;  
  44. }  
‹ 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:
  1. <div style="min-height: 100px">  
  2.     Blah  
  3. </div>  
... helyett ...
  1. <div>  
  2.     <div style="display:inline; float: right; height: 100px;"></div>  
  3.     Blah  
  4. </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.