Autor Zpráva
mersi
Profil
Mám takýto problém pri zmene veľkosti okna prehliadaca sa mi rozpada CSS design.
Neviete mi poradit kde som urobit chybu? velmi by ste mi pomohli

tu si môžete prezrieť stránku na ktorej mi to robi



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=utf-8" />
	<title>Reštaurácia U Hricka</title>
    <link rel="stylesheet" href="galeria_style.css" />
</head>
<body>
<div id="all">
  	<div id="header"></div>
  	<div id="menu">
    	<div id="menu1"></div>
        <div id="menu2"><a href="index.php"><img src="images/index/index_03_hover.jpg" border="0" /></a></div>
        <div id="menu3"><a href="listok.php?jedalny"><img src="images/index/index_04_hover.jpg" border="0" /></a></div>
        <div id="menu4"><a href="galeria.php"><img src="images/index/index_05_hover.jpg" border="0" /></a></div>
        <div id="menu5"><a href="kontakt.php"><img src="images/index/index_06_hover.jpg" border="0" /></a></div>
        <div id="menu6"><a href="rozvoz.php"><img src="images/index/index_07_hover.jpg" border="0" /></a></div>
        <div id="menu7"></div>
  	</div>
<div id="title">
    	<div id="title1"></div>
        <div id="title2"></div>
        <div id="title3"></div>
        <div id="title4"></div>
    </div>
<div id="content">
   	  	<div id="content1"></div>
        <div id="content2"></div>
   	  	<div id="content3"></div>
    </div>
<div id="footer" align="center">
    	<span class="copy">&copy; copyright
        <a href="http://mersi.tornadonet.sk/" target="_blank">mersi</a> | All rights reserved        </span>    </div>
</div>
</body>
</html>



CSS

*	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	}

body {
	line-height: 15px;
	text-align: center;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0xp;
	background-color: #34140A;
	}

#all {
	width: 998px;
 	text-align: left;
 	margin: 0 auto;
	}
	
#header {
	width: 100%px;
	height: 96px;
	background: url(images/index/index_01.jpg);
	background-repeat: no-repeat;
	}
	
#menu {
	position: absolute; top: 96px;
	height: 74px;
	}
	
#menu1 {
	width: 257px;
	height: 74px;
	background: url(images/index/index_02.jpg);
	float: left;
	}
	
#menu2 {
	width: 110px;
	height: 74px;
	float: left;
	}

#menu2 a { 
	display: block; 
	width: 110px; 
	height: 74px; 
	overflow: hidden; 
	background:url(images/index/index_03.jpg);
	} 
		
#menu2 a img { 
	border:none; 
	margin-left: 320px; 
	} 
	
#menu2 a:hover img { 
	margin-left: 0; 
	}

#menu3 {
	width: 88px;
	height: 74px;
	float: left;
	}
	
#menu3 a { 
	display: block; 
	width: 88px; 
	height: 74px; 
	overflow: hidden; 
	background:url(images/index/index_04.jpg);
	} 
		
#menu3 a img { 
	border:none; 
	margin-left: 320px; 
	} 
	
#menu3 a:hover img { 
	margin-left: 0; 
	}
	
#menu4 {
	width: 88px;
	height: 74px;
	float: left;
	}
	
#menu4 a { 
	display: block; 
	width: 88px; 
	height: 74px; 
	overflow: hidden; 
	background:url(images/index/index_05_hover.jpg);
	} 
		
#menu4 a img { 
	border:none; 
	margin-left: 320px; 
	} 
	
#menu4 a:hover img { 
	margin-left: 0; 
	}

#menu5 {
	width: 88px;
	height: 74px;
	float: left;
	}

#menu5 a { 
	display: block; 
	width: 88px; 
	height: 74px; 
	overflow: hidden; 
	background:url(images/index/index_06.jpg);
	} 
		
#menu5 a img { 
	border:none; 
	margin-left: 320px; 
	} 
	
#menu5 a:hover img { 
	margin-left: 0; 
	}

#menu6 {
	width: 89px;
	height: 74px;
	float: left;
	}

#menu6 a { 
	display: block; 
	width: 89px; 
	height: 74px; 
	overflow: hidden; 
	background:url(images/index/index_07.jpg);
	} 
		
#menu6 a img { 
	border:none; 
	margin-left: 320px; 
	} 
	
#menu6 a:hover img { 
	margin-left: 0; 
	}

#menu7 {
	width: 278px;
	height: 74px;
	background: url(images/index/index_08.jpg);
	float: left;
	}
	
#title {
	position: absolute; top: 170px;
	height: 147px;
	}

#title1 {
	width: 257px;
	height: 147px;
	background: url(images/index/index_09.jpg);
	float: left;
	}
	
#title2 {
	width: 239px;
	height: 147px;
	background: url(images/galeria/index_10.jpg);
	float: left;
	}
	
#title3 {
	width: 11px;
	height: 147px;
	background: url(images/galeria/index_11.jpg);
	float: left;
	}

#title4 {
	width: 491px;
	height: 147px;
	background: url(images/galeria/index_12.jpg);
	float: left;
	}
	
#content {
	position: absolute; top: 317px;
	height: 365px;
	}
	
#content1 {
	width: 131px;
	height: 365px;
	background: url(images/index/index_13.jpg);
	float: left;
	}
	
#content2 {
	width: 731px;
	height: 365px;
	background: url(images/galeria/index_14.jpg);
	float: left;
	}

#content3 {
	width: 136px;
	height: 365px;
	background: url(images/galeria/index_15.jpg);
	float: left;
	}
	
#footer {
	position: absolute; top: 682px;
	width: 998px;
	height: 106px;
	background: url(images/index/index_16.jpg);
	background-repeat: no-repeat;
	}
	
.copy {
	color: #886B3D;
	position: relative; top: 30px; left: 280px;
	}
	
	
#classic_text {
	text-align:justify;
	} 

a:link { color: #000000; }
a:visited { color: #000000; }
a:hover { color: #FFFFFF; }

.text a:link { text-decoration: none; } 
.text a:visited {  text-decoration: none; } 
.text a:hover { text-decoration: none; } 

mersi
Profil
nikto nic?
KGW
Profil
Máš to moc široký. Na 1024 je dole posuvník. A do stylu přidej min-width.
mersi
Profil
Máš to moc široký. Na 1024 je dole posuvník. A do stylu přidej min-width.


min-width na body?
KGW
Profil
na #all
mersi
Profil
dal som ale nepomohlo to :(
KGW
Profil
A v čem to prohlížíš?
A zvaliduj si css, např.
 padding: 0px 0px 0px 0xp;
mersi
Profil
no nejde to ani v opere ani vo firefoxe
SwimX
Profil
mersi
sem tam máš relativní, vedle zase absolutní pozici. Float tu a tam, ale nikde clear. Spousta divů, do by nemusela být.
Koukni jak funguje float a clear - http://www.pixy.cz/pixylophone/2003_12_archiv.html#1071056082
a vyhaž ty positiony

menu udělej přes <menu> nebo <ul>
mersi
Profil
dik za ten clanok, uz mi to ide a co je hlavne som tomu pochopil
este raz dik

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: