Autor Zpráva
Simj
Profil
Ahoj, mám rozvržení pro své stránky, které po půl hodině vypreparovávání vypadá zhruba takhle:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs_CS">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>Problém v IE6 s levým menu</title>
<style type="text/css">

html, body
{ 
 margin:0; 
 padding:0; 
 font-family: Verdana,Arial,Sans-serif;
 font-size: 90%; 
}

#pagewidth
{ 

}
 
#header
{
 position:relative; 
 height:182px;
 background-image: url('banner_bg.jpg');
 background-repeat: repeat-x; 
 width:100%;
 margin-bottom: 17px;
}

#wrapper
{
 margin-right: 15px;
}
 
#footer
{
 position: relative;
 width: 100%;
 text-align: center;
}
 
#leftcol
{
 width:22%; 
 float:left; 
 position:relative; 
}

#leftcol h5
{
 width: 70%;
 text-transform: uppercase;
 margin: 0 auto 5px auto;
 border-bottom: 1px solid black;
 padding: 5px 0 4px 5px;
}

#leftcol ul
{
 width: 70%;
 padding: 0 6px 0 18px;
 margin: 0 auto 15px auto;
 list-style-image: url(arrow.gif);
}

#maincol
{
 float: right; 
 display:inline; 
 position: relative; 
 width:78%; 
}

</style>
</head>
<body>
<div id='pagewidth'>
	<!-- <div id='header'>HLAVICKA</div> -->
	<div id='wrapper' class='clearfix' >
		<div id='maincol' >
		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi elit augue, congue nonummy, pulvinar at, scelerisque eu, quam. Vivamus adipiscing. Cras in eros. Mauris et mauris. Nam laoreet pede non justo. Sed non risus. Sed scelerisque. Cras vel sapien. Etiam tellus erat, adipiscing eu, ullamcorper a, pretium a, ante. Donec aliquet aliquet sapien. Ut in orci. Phasellus gravida urna in dolor. Nam risus lectus, lacinia ut, ornare vitae, rhoncus at, magna. Aenean fermentum, ligula id volutpat ullamcorper, nunc dolor tristique sapien, eu cursus sem enim nec sapien.</p>
		
		<p>Donec quis nibh vel turpis pharetra accumsan. Praesent pretium convallis dui. In tortor. Suspendisse a metus lacinia arcu tempor tincidunt. Sed leo. Proin egestas, nisi nec suscipit semper, ligula tellus egestas arcu, sed viverra est nulla a nisi. Pellentesque mollis nibh. Ut condimentum vehicula mi. Sed non diam. Sed sit amet nunc. Cras mi. Aliquam nulla velit, iaculis sed, congue non, condimentum facilisis, ligula. Sed consectetuer facilisis turpis. Integer massa enim, laoreet in, tempor sit amet, scelerisque ut, mi. Fusce molestie. Proin massa leo, rutrum sed, scelerisque et, malesuada bibendum, tortor. Vivamus viverra nisi et leo. </p>
		</div>
		<div id='leftcol' >
			<h5>Nadpis menu 1</h5>
			<ul>
				<li><a href="#">Odkaz a</a></li>
				<li><a href="#">Odkaz b</a></li>
				<li><a href="#">Odkaz c</a></li>
				<li><a href="#">Odkaz d</a></li>
			</ul>
			<h5>Nadpis menu 2</h5>
			<ul>
				<li><a href="#">Odkaz a</a></li>
				<li><a href="#">Odkaz b</a></li>
				<li><a href="#">Odkaz c</a></li>
				<li><a href="#">Odkaz d</a></li>
			</ul>
		</div>
	</div>
	<!-- <div id="footer">PATIČKA</div> -->
</div>
</body>
</html>


Tady to je jen ukázka, ale i jinak jsou moje stránky xhtml+css validní a správně se zobrazují ve Firefoxu, Konqueroru i Opeře. Problém nastává, ostatně jako vždy, s prohlížečem IE6 (Internet Explorer 7 jsem zatím neměl možnost zkusit).

V IE6 se při zmenšování okna začnou odkazy v levém sloupci (#leftcol) zalamovat až se nakonec celý sloupec "propadne" pod ten pravý (#maincol).

Předem děkuji za každou radu
Měsíček
Profil
(Internet Explorer 7 jsem zatím neměl možnost zkusit).

Já ano a poslušně hlásím, že v IE7 je to OK.
Simj
Profil
Já ano a poslušně hlásím, že v IE7 je to OK.

Díky. Zajímalo by mě kolik let se nad námi ještě bude vznášet temný stín IE6.

Do kódu výše jsem zapomněl přidat ještě jednu věc, která by tam měla být. Hack z csscreatoru:

 /* *** Float containers fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */ 
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  


Komentářem od Měsíčka je potvrzeno, že se skutečně jedná o chybu, která se vztahuje pouze k Internet Exploreru 6. Nevíte jak to opravit?
Davex
Profil
Není to chyba, ale vlastnost IE. Vyřeší se to absolutním pozicováním menu.
Simj
Profil
hehe díky moc. V jednoduchosti je síla, ale asi bych na to sám nepřišel.

Vaše odpověď

Mohlo by se hodit

Nezapomeňte na odkaz na živou ukázku problému.

Prosím používejte diakritiku a interpunkci.

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