dvakrát <div> vedle sebe
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.
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>
<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>
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>
Nové příspěvky
Smazani stranek
index.html )
HTML Tabulky
Zalamování textu pomocí CSS
Přesměrování
Arduino - 400 Bad Request
Nastavení českých písmen
POMOC! po druhé!
Pozicování (obrázek na střed).
Jak vycentrovat obrazek, ktery je v prikazu absolute ?
Použití tvůrce webu
katalog
async functions' is only available in es8 (use 'esversion: 8')
Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
Problém s načítáním
Div pro reklamu překrývá prvky webové stránky
Nezobrazuje se mi lišta s reklamou
ako nahrám na môj web favicon?
JavaScript - nečitelný soubor *.js - jak prohlížet/editovat
Problém s textem
videostream
index.html
GB///refresh///JS
Total Commander - server nenalezen
Mobilní verze webu
Další témata
STATUS
FTP
HTTP
SQL
PHP
© 2002 - 2024 Web zdarma s.r.o. — zvládnete to sami