Autor | Zpráva | ||
---|---|---|---|
wordík Profil * |
#1 · Zasláno: 7. 3. 2008, 21:48:42
Zdravim, dnes jsem narazil na problém s css kontejnery.
Mám jeden hlavní box (obal) a poté hlavní box, ve kterém mám zase 2 boxy. A právě zde nastal problém, pravý box se zobrazuje správně pouze v IE (překvapivě). Pro ukázku tu mám obrázky, první je z IE, druhý z FF i Opery: IE: http://img122.imageshack.us/img122/5366/iefn1.png FF & Opera: http://img408.imageshack.us/img408/2778/ffpc4.png HTML: <div id="page"> <div id="main"> <div class="left_box"> <h1>Test</h1> <p>Lorem ipsum dolor sit amet consectetuer eu et ut tortor laoreet. Vitae id Aenean tempus ultrices egestas dui Nam Morbi ut Nam. Montes vitae ligula Aliquam tincidunt venenatis at risus sagittis lobortis accumsan. Vel nunc habitant et cursus eget et Vestibulum mauris quis sit. Malesuada adipiscing sed tincidunt laoreet felis orci semper lorem parturient id. Venenatis adipiscing felis lacus at id Nunc accumsan urna Sed.</p> <p>Ligula mauris Quisque leo Curabitur Cras Mauris sollicitudin In eu ligula. Augue rhoncus pharetra pretium pede augue vel et Morbi dignissim velit. Convallis nulla eget ac et elit consectetuer lacinia Aenean Suspendisse Sed. Est dui turpis adipiscing neque egestas sit et orci orci hendrerit. Dolor ut leo Aenean nibh Nulla orci sagittis.</p> <p>Eros tortor mauris nascetur suscipit eget vitae tincidunt ac pulvinar lacus. At ornare Curabitur feugiat Lorem eget quis leo Cras Vestibulum nisl. Ut eros dignissim Suspendisse orci Cras sed amet rutrum enim pellentesque. Fames Vivamus elit aliquam volutpat lobortis laoreet nec wisi laoreet leo. Elit nec sem justo ipsum est consequat Lorem Vestibulum senectus amet. Et.</p> <p>Sed eu sapien sagittis sodales augue enim lacus nec ut dapibus. Eros et Ut dui a eget vel tempor convallis sit tincidunt. Diam laoreet nunc convallis enim nibh eget nulla orci Curabitur tristique. Curabitur vitae orci amet mauris wisi netus justo sem id et. Ipsum Curabitur nibh dui leo id tempus.</p> </div> <div class="right_box"> <span class="new_date">6.března 2008</span> - test<br> <div class="new_text">»Lorem ipsum dolor sit amet consectetuer eu et ut tortor laoreet. Vitae id Aenean tempus ultrices egestas dui Nam Morbi ut Nam.</div> </div> </div> </div> CSS: div#page{ width: 800px; margin: 0px auto; padding: 5px; } div#main{ border: 1px solid #000000; background-color: #ffffff; width: 100%; height: 100%; text-align: left; margin-top: 3px; padding: 5px; } .left_box{ width: 560px; float: left; } .right_box{ border: 1px solid #000000; width: 225px; padding: 5px; } .new_date{ font-weight: bold; } .new_text{ margin-left: 5px; margin-bottom: 5px; } PS: zkoušel jsem i: .right_box{ border: 1px solid #000000; width: 220px; padding: 5px; float: right; } ale FF a Opera to zobrazí pro změnu takto: ODKAZ jako kdyby box main, kontejnery vůbec nevnímaly. Díky předem za pomoc |
||
Manq Profil |
#2 · Zasláno: 7. 3. 2008, 21:51:55
V druhém připadě ti chybí čistič. Zaclearuj na konci obalového divu nebo mu nastav overflow:hidden;.
|
||
Dero Profil |
#3 · Zasláno: 7. 3. 2008, 21:52:52
wordík: Ano, plovoucí boxy jsou vyňaty z běžného toku dokumentu. V tomto konkrétním případě to znamená, že tvůj druhý pokus s dvojím floatováním je proveditelný, pokud za oba prvky (ale stále do bloku main) vložíš prvek s nastaveným clear: both.
Existují i jiná řešení, ale tohle je pro pochopení problematiky nejlepší. |
||
wordík Profil * |
#4 · Zasláno: 7. 3. 2008, 22:12:12
aha, oběma děkuji za pomoc ;-)
|
||
Časová prodleva: 16 let
|
0