Rozvržení stránky

kulenka · Příspěvekod **kulenka** » 10 led 2011 15:57

Hezký den, obracím se na vás s dotazem, jak upravit stávající stránky, tak aby obsah stránek končil u patičky stránky a pozadí stránky u obsahu se automaticky rozšířilo podle délky textu.

html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />
<title>Paříž - informace a památky</title>
<link href="styly.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="hlavicka">
<h1 align="center">Paříž - město mnoha tváří</font></h1></div>
<div id="menu">
<li><a class="tlacitko" href="index.html">Základní informace</a></li>
<li><a class="tlacitko" href="pamatky.html">Památky v Paříži</a></li>
<li><a class="tlacitko" href="umeni.html">Umění a kultura</a></li>
<li><a class="tlacitko" href="ubytovani.html">Ubytování</a></li>
<li><a class="tlacitko" href="doprava.html">Doprava</a></li>
<li><a class="tlacitko" href="pocasi.html">Počasí</a></li>
<li><a class="tlacitko" href="odkazy.html">Zajímavé odkazy</a></li>
</div>
</div>
<div id="obsah">
<h2 align="left">Základní informace</h2>
<br>
<img src="images/mesto.jpg" alt="Paříž" />
<br>
<table width="400" border="1">
<tr>
<td>Rozloha:</td>
<td>86,9 km<sup>2</sup></td>
</tr>
<tr>
<td>Počet obyvatel:</td>
<td>2 153 600</td>
</tr>
<tr>
<td>Měna:</td>
<td>euro (EUR)</td>
</tr>
<tr>
<td>Úřední jazyk:</td>
<td>francouzština</td>
</tr>
</table>
</p>
<p align="left">text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </p>
<p align="left">text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </p>
<div align="left">p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text
</p>

</div>
</div>
<div id="patka">
<div>
<div align="center"><a href="mailto:sem@mail.cz">| webmaster |</a></div>
</div>
</div>
</body>
</html>

CSS:
/* CSS Document */

*{
margin:0px;
padding:0px
}
html{
width:100%;
height:100%;
}
body{
width:800px;
height:100%;
position:relative;
margin:0 auto;
}

#hlavicka { background-image:url(images/hlavicka.jpg);
width:800px; height:260px;
background-repeat:no-repeat;
position: absolute; left:51px; top:29px;
}
#hlavicka h1{ color:#FFFFFF; font-family:Arial, Helvetica, sans-serif; margin-left:20px; margin-top:auto}

#menu {
background-color: #98DA67;
width:200px; height:390px;
position:absolute; left:50px; top:293px;
padding-top:50px;
list-style: none;
margin: 0;
padding: 0;
}

a.tlacitko{
border-bottom: 1px solid #D1D1D1;
background-color: #0099FF;
font-size: 12pt;
font-family: Arial, Helvetica, sans-serif;
width: 190px;
padding: 10px 5px 0px 5px;
color: #000000;
margin: 0px 0px 0px 0px;
display: block;
}
a.tlacitko:link{
text-decoration: none;
color: #000000;
}
a.tlacitko:visited{
text-decoration: none;
color: #000000;
}
a.tlacitko:hover{
background-color: #98DA67;
text-decoration: none;
border-bottom : 1px solid white;
color: #666666;
}

#obsah {background-color: #BDD4DF;
width:559px; height:370px;
position:absolute; left:253px; top:293px;
padding:20px; padding-top:0px
}

#patka {background-color: #3399FF;
width:800px; height:40px;
position:absolute; left:50px; top:687px
}

#patka div{margin-right:20px;margin-top:10px;text-align: right;}
#patka a:hover{text-decoration:none;}
#patka a{color: #CCCCCC}

Reklama

CZechBoY · Příspěvekod **CZechBoY** » 10 led 2011 16:24

width:90% dej tma prostě něco v procentech, pak tam ještě nezapoměň dát min-width: 900px nebo podle toho jakou máš šířku hlavičky, nebo nějakýho menu horního, aby to nebylo zas moc úzký
pošli web ať s enemusim plácat v neobarveným kódu

kulenka · Příspěvekod **kulenka** » 10 led 2011 16:48

http://ivle.cz/aindex.html

tady to vypadá líp, ale jinak se mi to zobrazuje tak, že text je pod patičkou

CZechBoY · Příspěvekod **CZechBoY** » 10 led 2011 16:53

ten height dej do pryč, nepotřebuješ ho tam dávat

kulenka · Příspěvekod **kulenka** » 10 led 2011 17:08

který?

CZechBoY · Příspěvekod **CZechBoY** » 10 led 2011 17:18

všechny kromě menu

kulenka · Příspěvekod **kulenka** » 10 led 2011 22:21

Děkuji, už to vypadá o něco lépe, ale pořád to není ono:-(

CZechBoY · Příspěvekod **CZechBoY** » 11 led 2011 14:16

nevím co to znamená není to ono, nevím jak chceš aby to vypadalo, když si to vyfoť(PrintScrn) a v malování nebo něčem udělej náhled jak to má vypadat

Rozvržení stránky

Rozvržení stránky

Re: Rozvržení stránky

Re: Rozvržení stránky

Re: Rozvržení stránky

Re: Rozvržení stránky

Re: Rozvržení stránky

Re: Rozvržení stránky

Re: Rozvržení stránky

Kdo je online