Urobil som 3 stĺpcový layout, pri ktorom som sa vlastne učil CSS, ale vyskytol sa problém - keď v si IE nastavým veľkosť textu na malé alebo najmenšie, tak sa pravý stĺpec zosunie až pod obsah. Neviete ako by sa tomu dalo zabrániť? Alebo čo som spravil zle? Adresa stránky:
je tu a css kod je tu:
*
{
margin: 0;
padding: 0;
}
html, body
{
font-family: arial, "Trebuchet MS", tahoma, verdana, sans-serif;
text-align: center;
background-color: #C4E1FF;
}
body
{
min-width: 48em;
margin: 0 auto;
}
div#hlavne
{
width: 48em;
text-align: left;
margin: 0 auto;
}
hr
{
display: none;
}
div#obr
{
width: 768px;
height: 144px;
border: none;
display: block;
background: url(logo.jpg);
}
a#skok, a#skok:hover
{
position: absolute;
color: #C4E1FF;
top: 10px;
left: 600px;
z-index: 0;
font-size: 1mm;
}
h3
{
display: none;
}
ul#nav1, ul#nav2
{
list-style-type: none;
width: 10em;
}
ul#nav2
{
_width: 9.8em;
}
ul#nav1 li
{
_border-bottom: 1px solid #C4E1FF;
}
ul#nav2 li
{
_border-bottom: 1px solid #C4E1FF;
}
ul#nav2 li h4
{
color: #000;
font-size: 1em;
font-weight: bold;
}
ul#nav1 li a, ul#nav1 li a:hover
{
color: #fff;
font-weight: bold;
display: block;
background-color: #0061C1;
text-decoration: none;
}
ul#nav2 li a, ul#nav2 li a:hover
{
color: green;
font-weight: bold;
display: block;
background-color: #C4E1FF;
text-decoration: underline;
}
ul#nav1 li a:hover
{
color: #000;
background-color: #fff;
text-decoration: none;
}
ul#nav2 li a:hover
{
color: green;
background-color: #fff;
text-decoration: none;
}
ul#nav1
{
float: left;
}
div#vpravo
{
margin: 0 0 0 38em;
}
div#obsah
{
width: 28em;
float: left;
}
div#obsah a, div#obsah a:hover
{
color: green;
font-weight: bold;
text-decoration: underline;
}
div#obsah a:hover
{
background: #fff;
text-decoration: none;
}
div#pata
{
color: #fff;
font-weight: bold;
background-color: #0061C1;
font-size: 0.8em;
padding: 0.2em;
width: 100%;
clear: both;
}
div#pata a, div#pata a:hover
{
color: #fff;
font-weight: bold;
text-decoration: underline;
}
div#pata a:hover
{
background: #fff;
color: #000;
text-decoration: none;
}
