ie6/ie7 bug: floatolt elemek sorokra bontása
sziasztok,
a probléma:
egy lista elemeit szeretném sorokba rendezni. a float: left; tulajdonság elég is ha egyenlő magasak a listaelemek, de ha változó a magasságuk akkor elcsúsznak az elemek (lásd előző téma :)). ezért adtam minden sor első elemének egy clear: left; tulajdonságot, ami a szabványos böngészőkben kiválóan működik is, nem úgy mindnyájunk kedvenc böngészőjének 6-os és 7-es verziójában. készítettem egy példa oldalt is.
amit próbáltam:
rákerestem ie, ie6, bug, float, clear, rows, stb szavak variációira, eddig egy ígéretes oldalt találtam de a téma hasonlósága ellenére sem felelnek meg nekem az ott felsorolt megoldások.
amit nem szeretnék:
a listát több listára bontani.
minden ötletet köszönök:
gex
■ a probléma:
egy lista elemeit szeretném sorokba rendezni. a float: left; tulajdonság elég is ha egyenlő magasak a listaelemek, de ha változó a magasságuk akkor elcsúsznak az elemek (lásd előző téma :)). ezért adtam minden sor első elemének egy clear: left; tulajdonságot, ami a szabványos böngészőkben kiválóan működik is, nem úgy mindnyájunk kedvenc böngészőjének 6-os és 7-es verziójában. készítettem egy példa oldalt is.
amit próbáltam:
rákerestem ie, ie6, bug, float, clear, rows, stb szavak variációira, eddig egy ígéretes oldalt találtam de a téma hasonlósága ellenére sem felelnek meg nekem az ott felsorolt megoldások.
amit nem szeretnék:
a listát több listára bontani.
minden ötletet köszönök:
gex
inline block
kipróbáltad?
kipróbáltam
Sztem te is próbáld ki :)
én is...
az alap ie(6) mágiákon (display: inline(-block), position: relative, zoom: 1) már a kérdésfeltevés előtt végigszaladtam. de ha neked tényleg megy akkor kérlek mutasd meg hogyan.
igye
köszönöm és whitespace gond
másodszor pedig van egy kis gondom a whitespace-ekkel. értem a cikket, értem az általuk javasolt megoldást, a példaoldalamon a display: inline-block-ot használó lista első három eleme közül kivettem a whitespace karaktereket, ott nagyon jól látszik a különbség.
viszont nem értem hogy a te példaoldalad miért jelenik meg jól pl ffben. sőt mindenben amiben eddig néztem kivéve chrome-ban. erre van ötleted?
kicsit módosítottam rajta
Sztem most minden böngészőben jó...
De ezekben tutti: Chrome 2.0.172.39, IE8, Firefox 3.5.1 (most csak ezeket találtam)
white-space
nem az igazi
viszont bár ff-ben megjavult winxp opera 9.62ben, safari 3.2.2ben és chrome 2.0.172.39ben se segített. ráadásul az elsőben a gap nem szűnt meg, az utóbbiakban pedig az ul szélessége lett kisebb.
szerk: egyébként valószínűleg az lesz hogy maradok a float-nál és conditional commenttel vagy css hack-kel megadom ezt a display: inline-block-os módszert az ie6-ie7-nek.
megoldás(ok)
viszont legalább jó minden böngészőben ami számít (nekem).