Potrzebuje ulozyc pare elementow blokowych po prawej lub po lewej, ustawic marginesy i oblac je tekstem.
Pełna wersja: 2x wiekszy margines pod IE
Dlaczego IE ustawia te obiekty od krawedzi okna z marginesem 2x wiekszym niz jest w stylach okreslony?
Jeśli nie nadasz elementom szerokości, to będziesz miał problem jak wypełnisz divy textem.
Z tym wiążą się też marginesy. Ja bym to zrobił tak:
Kolorki dałem żeby zobrazować całą sytuację
Z tym wiążą się też marginesy. Ja bym to zrobił tak:
Kod
<style type="text/css">
div#cont {
width:100%;
}
div#left {
width:50%;float:left;background-color:red
}
div#left p {
margin:0 0 0 100px;background-color:yellow
}
div#right {
float:right; width:50%;background-color:green
}
div#right p {
margin:0 100px 0 0;background-color:blue
}
</style>
div#cont {
width:100%;
}
div#left {
width:50%;float:left;background-color:red
}
div#left p {
margin:0 0 0 100px;background-color:yellow
}
div#right {
float:right; width:50%;background-color:green
}
div#right p {
margin:0 100px 0 0;background-color:blue
}
</style>
Kolorki dałem żeby zobrazować całą sytuację
Potrzebuje dokladnie taki efekt jak ponizej. Z tym ze w tej chwili zamiast DIV zastosowalem SPAN i jakos to wyszlo. Te elementy blokowe beda dynamicznie generowane przez php, wiec nie wiem ile ich bedzie w jednym rzedzie. Ale bede mial mozliwosc ustalenia ich rozmiarow. I dlatego chce zastosowac DIV. W dodatku raz beda ulozone do lewej a raz do prawej i prawie zawsze oblane beda tekstem.
Witam,
rozwiązania twojego problemu trzeba szukać tu: Positioniseverthing
Spotkałeś się z tzw. IE Doubled Float-Margin Bug.
Pokrótce:
Jeżeli masz element z ustawionym float:left i ma on margin-left:10px to IE podwoi ten margin, co da w efekcie margines 20px.
Jezeli masz nastepujace po sobie elementy z taka sama wartoscia float (np.left), to bug ten dotknie tylko pierwszego z elementów.
Rozwiązanie wydaję się być tyleż banalne co niezrozumiałe: dla elementu, którego margin jest podwajany ustaw display:inline. Banalne, bo sprawę załatwia w mig. Niezrozumiałe, bo element (jako że ma float) pozostaje blokowy i zachowuje się jak blokowy.
Polecam jednak lekturę opsiu błędu pod podanym adresem, napisałem tak z pamięci jak to jest, być może przeoczyłem coś.
pozdr.
rozwiązania twojego problemu trzeba szukać tu: Positioniseverthing
Spotkałeś się z tzw. IE Doubled Float-Margin Bug.
Pokrótce:
Jeżeli masz element z ustawionym float:left i ma on margin-left:10px to IE podwoi ten margin, co da w efekcie margines 20px.
Jezeli masz nastepujace po sobie elementy z taka sama wartoscia float (np.left), to bug ten dotknie tylko pierwszego z elementów.
Rozwiązanie wydaję się być tyleż banalne co niezrozumiałe: dla elementu, którego margin jest podwajany ustaw display:inline. Banalne, bo sprawę załatwia w mig. Niezrozumiałe, bo element (jako że ma float) pozostaje blokowy i zachowuje się jak blokowy.
Polecam jednak lekturę opsiu błędu pod podanym adresem, napisałem tak z pamięci jak to jest, być może przeoczyłem coś.
pozdr.
Cytat(siemakuba @ 2005-11-24 11:41:38)
Rozwiązanie wydaję się być tyleż banalne co niezrozumiałe: dla elementu, którego margin jest podwajany ustaw display:inline. Banalne, bo sprawę załatwia w mig. Niezrozumiałe, bo element (jako że ma float) pozostaje blokowy i zachowuje się jak blokowy.
Kiedyś mnie to zaciekawiło i trochę o tym poczytałem.
Taka metoda to naprawienie buga IE za pomocą 2 innych bugów ;-)
1) Właściwość display teoretycznie jest ignorowana jeśli elementowi nadaliśmy "float", więc Opery/FF/K to ignorują. IE natomiast traktuje to całkiem poważnie i element staje się liniowym.
2) Formatowanie za pomocą height i width w Operze/FF/K działa, bo dla nich jest to nadal element blokowy. Natomiast IE jest głupie i pozwala okreslać elementy typowe dla elementów blokowych elemenom liniowym. Więc mimo, że dostaliśmy element liniowy to height i width działają.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.