nazdar
vie niekto upravit tento kod aby isiel aj v IE? skusal som ten layount na FF Opere a tam to ide vporiadku ale na IE6 nie.
css
body
{
min-width: 630px; /* 2 x (LC plna-sirka + CC padding) + RC plna-sirka */
}
#stranka{
width: 80%;
margin: 0 auto;
}
#container
{
padding-left: 200px; /* LC plna-sirka */
padding-right: 190px; /* RC plna-sirka + CC padding */
position: relative; /* Resi "nekonecnou" stranku v IE7 */
}
#container .column
{
position: relative;
float: left;
}
#center
{
padding: 10px 20px; /* CC padding */
width: 100%;
}
#left
{
width: 180px; /* LC width */
padding: 0 10px; /* LC padding */
right: 240px; /* LC plna-sirka + CC padding */
margin-left: -100%;
}
#right
{
width: 130px; /* RC width */
padding: 0 10px; /* RC padding */
margin-right: -100%;
}
#paticka-uvnitr
{
clear: both;
}
/*** oprava pro IE ***/
* html #left
{
left: 150px; /* RC plna-sirka */
}
/*** Stejna vyska sloupcu ***/
#container
{
overflow: hidden;
}
#container .column
{
padding-bottom: 1001em; /* X + padding-bottom */
margin-bottom: -1000em; /* X */
}
/*** oprava paticky ***/
* html body
{
overflow: hidden;
}
* html #paticka
{
float: left;
position: relative;
width: 100%;
padding-bottom: 10010px;
margin-bottom: -10000px;
background: #FFF; /*** Stejne jako u body ***/
}
/*** Jen pro vzhled ***/
body
{
margin: 0;
padding: 0;
background: #FFF;
}
#hlavicka, #paticka-uvnitr
{
font-size: large;
text-align: center;
padding: 0.3em 0;
background: #999;
}
#left
{
background: #66F;
}
#center
{
background: #DDD;
}
#right
{
background: #F66;
}
#container .column
{
padding-top: 1em;
text-align: justify;
}
HTML
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css">
<title>Třísloupocový layout - svatý grál -- Interval.cz</title>
</head>
<body>
<div id='stranka'>
<div id="hlavicka">Toto je hlavička stránky.</div>
<div id="container">
<div id="center" class="column">
<h1>Toto je hlavní panel</h1>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p> <p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
<p>Lorem ipsum... </p>
</div>
<div id="left" class="column">
<h2>Toto je levý panel</h2>
<p>Lorem ipsum... </p>
</div>
<div id="right" class="column">
<h2>Toto je pravý panel</h2>
<p>Lorem ipsum... </p>
</div>
</div>
<div id="paticka">
<div id="paticka-uvnitr">Toto je patička stránky.</div>
</div>
</div>
</body>
</html>
THNX
