Autor Zpráva
Dracek
Profil *
Ahoj, tak uz jsem tu zase :)

Resim problem jak v trisloupcovem layoutu udelat aby se mi vsechny sloupce roztahovali az k paticce. Nasel jsem techniku falesnych sloupcu, ale mam problem, jak ty 3 sloupce obalit. Protoze maji nastaveno float: left. Takze kdyz je obalim divem, tak se udela jen takovy prouzek nahore. Uz jsem bezradnej.
Měsíček
Profil
Já taky .. proč nikdy nepošlete hned v prvním příspěvku alespoň odkaz na stránku? :(

Jinak můžeš se pokusit pod plaváčky dát clear:both;, ale myslím, že to nebude hlavním bodem problému.
vertigo4
Profil
Dracek
pod ty sloupce vlož tzv. clear ... zkus hledat co to je
Manq
Profil
Dracek
Stačí na konec obalového divu přidat čistič.

Třeba <div style="clear:both;">&nbsp;</div>

EDIT:Cash.
Dracek
Profil *
Huste ten cistic mi tam presne chybel :)

Pro mesicek: tady to mas. Vystrihal jsem z toho svoje hotove veci, ale snad ta zakladni struktura bude trzet pohromade.
html:
<body>
<div id="wrap">
<div id="main">
<div id="header">
<span class="noscreen"><a href="http://home.cz/" title="skok na úvodní stránku">home</a></span>
</div><!-- /header -->
<div id="obalovak">
<div id="left">
<p>levej sloupec</p>
</div><!-- /left -->
<div id="center">
<p>prostredni sloupec</p>
</div><!-- /center -->
<div id="right">
<p>pravy sloupec</p>
</div><!-- /right -->
<div style="clear:both;">&nbsp;</div><!-- toto je kuli ukonceni obtekani -->
</div><!-- /obalovak --><!-- toto je kuli technice falesnych sloupcu -->
<div id="bottom">
<p>pata &nbsp;&nbsp;&nbsp;&nbsp;</p><!-- ty 4 prazdne znaky jsou kuli ie bugu, jinak se konec textu zobrazuje 2x -->
</div><!-- /bottom -->
</div><!-- /main -->
</div><!-- /wrap -->
</body>


css:

/* CSS Document */
/********************************************************************* **********
Hlavni CSS Document - vystup pro obrazovku
projekt: projekt.cz
********************************************************************** *********/

/* ZAKLADNI */
/*==================================================================== ========*/
body, p, img, form, table, tr, th, td, h1, h2, h3, h4, h5 {
padding: 0;
margin: 0;
border: none;
}

abbr, acronym {
border-bottom: 1px dotted;
cursor: help;
}

/* SPECIALNI */
/*==================================================================== ========*/
.noscreen {
display: none;
}

#obalovak{
background: #6d7c83 url(../design/1.gif) repeat-y;
}


/* ODKAZY */
/*==================================================================== ========*/
A {
color:#dddddd;
text-decoration: underline;
}

A:link {
color:#dddddd;
text-decoration: underline;
}

A:visited {
color:#dddddd;
text-decoration: underline;
}

A:active {
color:#dddddd;
text-decoration: underline;
}

A:hover {
color:#ffffff;
text-decoration: none;
}

/* LAYOUT */
/*==================================================================== ========*/
body {
font-size: small;
font-family: arial, tahoma, verdana, sans-serif;
color: #d1d1d1;
background: #555555 url(../design/web-bg.gif);
text-align: center;
}

#wrap {
margin: 0 auto;
width: 1024px;
}

#main, #header, #menu {
width: 950px;
}

#main {
overflow: hidden;
float: left;
padding: 0;
text-align: left;
}


/* logo */
/*==================================================================== ========*/
#header {
margin: 22px 0 0 141px;
height: 100px;
width: 668px;
background: url(../design/logo.jpg) no-repeat 50% 0;
}
/* levy blok */
/*==================================================================== ========*/
#left {
overflow: hidden;
float: left;
min-height: 500px; /* pro normalni prohlizece */
_height: 500px; /* pro ******* IE*/
width: 141px;
background: #6d7c83 url(../design/top-bg.gif) repeat-x;
}
/* prostredni blok */
/*==================================================================== ========*/
#center {
float: left;
min-height: 500px; /* pro normalni prohlizece */
_height: 500px; /* pro ******* IE*/
width: 668px;
background: #2c3940;
}
/* pravy blok */
/*==================================================================== ========*/
#right {
float: left;
min-height: 500px; /* pro normalni prohlizece */
_height: 500px; /* pro ******* IE*/
width: 141px;
background: #6d7c83 url(../design/top-bg.gif) repeat-x;
}
/* pata */
/*==================================================================== ========*/
#bottom {
float: left;
height: 50px;
width: 950px;
background: url(../design/bottom-bg.gif) repeat-x;
}
Dracek
Profil *
hups, v komentarich u css tu zapracovala cenzura :) sorry zapomel jsem na to. Nepocital jsem s tim, ze to budu nekde zverejnovat.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

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

0