dvakrát <div> vedle sebe
5 příspěvků
Archiv diskusního fóra
Fórum je uzavřené a slouží pouze ke čtení. Některé informace mohou být zastaralé.
-
Dobrý den, potřebuji vyřešit následující problémek, který se mi pomocí css nedaří. Mám dva bloky. V jednom je obrázek, v druhém text. Můj problém spočívá v tom, že je-li obrázek vyšší než text, řadí se mi další div s obrázkem vedle prvního divu. Příklad : <obrazek> <text> ................<obrazek> <text> Při kódu : <div float:left><img></img></div> <div>text</div> Nepomohlo mi ani zabalit tyto dva divy do jednoho divu.
-
Ještě dodatek.. Chtěl bych pomocí CSS docílit stejného efektu jako při : <table> <tr><td><img></img></td><td>text</td></tr> <tr> ..... </tr> </table>
-
A co tam dát <BR CLEAR="all"> Další obsah stránky by měl být až pod tímto. Nebo do DIVu text napsat CLEAR: all; To jsem teď zrovna ale řešil a Opera to nějak nechce brat. Zkus ten první způsob.
-
to jsem zkoušel, ale druhý "řádek" se mi posunul až pod levý sloupec
-
<BR CLEAR="all"> No fuj! ;-) > CLEAR: all; V CSS neexistuje, místo toho je definována vlastnost clear: left | right | both. Ta zařídí, aby objekt neobtékal ten před ním, který má float: left nebo float: right či nebo oba dva. <div style="float: left">Tento má být obtékán</div> <div>Tento ho bude obtékat</div> <div>A tento taky</div> <div style="float: left">Tento má být obtékán</div> <div>Tento ho bude obtékat</div> <div style="clear: both">ALE TENTO TED UZ NE</div> // popřípadě stačí jen clear: left To tvoje <table> <tr><td><img></img></td><td>text</td></tr> <tr> ..... </tr> </table> můžeš vyřešit třeba takto: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/strict.dtd"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2"> <title>Galerie obrázků</title> <style type="text/css"> <!-- #galerie img { display: block; clear: both; float: left } --> </style> </head> <body> <div id="galerie"> <h1>Galerie obrázků</h1> <img src="img1.gif" width="100" height="100" alt=""><p>Kratky popis obrazku</p> <img src="img2.gif" width="100" height="100" alt=""><p>Kratky popis obrazku</p> <img src="img3.gif" width="100" height="100" alt=""><p>Kratky popis obrazku</p> <img src="img4.gif" width="100" height="100" alt=""><p>Kratky popis obrazku</p> <img src="img5.gif" width="100" height="100" alt=""><p>Kratky popis obrazku</p> </div> </body>