Autor Zpráva
LosPivkos
Profil *
Dobrý den, potřeboval bych poradit, chtěl bych mít určitou mezeru mezi obrázky, poradily jste mi, že mám použít příkaz margin, tak jsem to udělal takto, vše by bylo v pořádku, jen nevím jak udělat, aby fungovala jen šířka. Když to zadám, obrázky se rozhodí jak na výšku tak i na šířku.
Takto vypadá ten zápis:
<table width="410" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
	<td align="center"><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" style="float: right; margin: 188px"></a></td> 
	<td align="center"><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" style="float: none; margin: 188px" ></a></td>
	<td align="center"><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2"></a></td>
</tr>
</table> 


Díky moc za rady.
panther
Profil
LosPivkos
Když to zadám, obrázky se rozhodí jak na výšku tak i na šířku.
jak se rozhodí? Myslíš tím, že je mezera 188px ze všech stran?

Pokud ano, je vše v pořádku.
margin: a b c d; => a - margin-top, b- margin-right, c - margin-bottom, d - margin-left
margin: a b c;   => a - margin-top, b - margin-right, margin-left, c - margin-bottom
margin: a b;     => a - margin-top a margin-bottom, b - margin-right a margin-left
margin: a;       => a - margin ze všech stran stejný

Jestli máš problém s něčím jiným, dodej odkaz na problematickou stránku nebo lépe popiš problém.
LosPivkos
Profil *
Ahoj, nevím si rady, proto raději dám celou stránku, snad to bude lepe pochopitelné.

<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>PowerProject</title>
<meta name="keywords" content=" powerproject, teplo," />
</head>
<body bgcolor="yellow">
<div align="center" id="nadpis">
<font size="8" face="Cooper Black" color="#3300CC" "nazevstranky">Podle získávání tepla</font>
</div>
<br><br><br><br><br>
<strong><font size="7" color="#FF0000">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Vrt
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Plošný kolektor
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Vzduchový systém</font></strong>
<br><br><br><br>
<table width="410" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center"><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" style="float: right; margin:"></a></td>
<td align="center"><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" style="float: none; margin:" ></a></td>
<td align="center"><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2" style="float: none; margin-right 25px"></a></td>
</tr>
</table>
</html>

Dělám si to v PSPaDu a pokud si tu stránku zobrazíte, tak bych potřeboval obrázek vrtu(obr.č1) aby byl pod názvem vrt, obrázek s kolektorem aby byl pod názvem Plošný kolektor a to samé i u obrázku č.3.
Předem díky moc.
Anika
Profil *
Přidělej si ještě jeden řádek tabulky nad řádek s obrázky a tam si vlož ty názvy.
Asi takhe:
<table>
<tr>
<td>
Vrt
</td>
<td>
Plošný kolektor
</td>
<td>
Vzduchový systém
</td>
</tr>
<tr>
<td>
obrázek
</td>
<td>
obrázek
</td>
<td>
obrázek
</td>
</tr>
</table>
LosPivkos
Profil *
Omlouvám se, že takhle otravuju, ale když jsem to udělal, tak ty názvy mám vedle sebe, čim mezi nimi udělám mezeru?
Posílám zápis:

<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>PowerProject</title>
<meta name="keywords" content=" powerproject, teplo," />
</head>
<body bgcolor="yellow">
<div align="center" id="nadpis">
<font size="8" face="Cooper Black" color="#3300CC" "nazevstranky">Podle získávání tepla</font>
</div>
<br><br><br><br><br>
<table width="0" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td>Vrt</td>
<td> Plošný kolektor </td>
<td> Vzduchový systém </td>
</tr>
</table>
<br><br><br><br>
<table width="410" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center"><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" style="float: right; margin:"></a></td>
<td align="center"><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" style="float: none; margin:" ></a></td>
<td align="center"><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2" style="float: none; margin-right 25px"></a></td>
</tr>
</table>
</html>
Anika
Profil *
Hlavní chyba je vtom, že tam máš dvě tabulky a ne jednu tabulku o dvou řádcích.
Zkus tohle:


<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN"
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">;
<title>Powerproject</title>
<style>
table {text-align:center}
img {margin-left:10px; margin-right:10px; margin-top:30px; width:210px; height:170px}
body {background-color:yellow}
h1 {color:#3300CC; font-size:300%}
#hlavni {margin-left:auto; margin-right:auto; width:750px}
</style>
</head>

<body>
<div style="text-align:center">
<div id="hlavni">
<h1>Podle získávání tepla</h1>
<table>
<tr>
<td><h2>Vrt</h2></td>
<td><h2> Plošný kolektor</h2> </td>
<td><h2> Vzduchový systém</h2> </td>
</tr>
<tr>
<td><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" ></a></td>
<td><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" ></a></td>
<td ><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2" ></a></td>
</tr>
</div>
</div>
</body>
</html>

Mezera mezi obrázky se zvětší nebo zmenší, když upravíš hodnoty u margin-left a margin-right u img ve <style> v hlavičce, ale dej si pozor, ať všechny součty marginy + šířka obrázů + rámečků není víc než 750px, to je šířka stránky.
Margin-top:30px nastyví o kolik budou obrázky dole pod nadpisy, když napíšeš víc, odskočí dolů.
Snad jsem správně pochopila tvůj problém.

Nestačí k obrázkům napsat rel="lightbox" to nebude fungovat.
Float je tam nanic.
Do tabulky o šířce 410 se nemůžou vejít tři obrázky o šířce 210 a ještě mezery.
Používej pro nadpisy tagy <h1><h2> atd., je to dost důležité kvůli struktuře dokumentu, vyhledávačům, aby poznaly, co je důležité a podobně.
Anika
Profil *
Teď jsem si všimla, že jsem zapomněla smazat width="210" a height="170" u všech obrázků, to už je ve <style>, tady už je to zbytečné.
Anika
Profil *
Ještě omluva, v tom kódu jsem zapomněla uzavřít tabulku - za poslední </tr>
patří </table>. Jsem hlava děravá.
LosPivkos
Profil *
Díky moc, takhle jsem to přesně potřeboval, doufám, že jednou to budu umět jako ty, ještě jednou díky, moc mi to pomohlo.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: