lenka
30.07.2011, 20:43
Zdravím, som začiatočník a dosť ešte lama...robím v podstate prvú stránku a zatiaľ mám len jej časť. Problém je v tom, že pokým firefox zobrazuje stránku čisto pekne bez problémov, tak v IE je to veľká katastrofa. Ako to optimalizovať aby to aspoň ako tak vyzeralo? HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="generator" content="PSPad editor, www.pspad.com">;
<link rel="stylesheet" href="css/index.css" type="text/css">
<title>SOSAUTO</title>
</head>
<body>
<div style="width: 940px; margin-left: auto; margin-right: auto;">
<div id="header"> <!---start header-->
<h1><a href="#">sosauto.eu</a></h1>
</div> <!---end header-->
<div id="wrapper"> <!---start wrapper-->
<ul class="nav">
<li><a href:"#">O nás</a></li>
<li><a href:"#">Poradňa</a></li>
<li><a href:"#">Download</a></li>
<li><a href:"#">Inzercia</a></li>
<li><a href:"#">Kontakt</a></li>
</ul>
<div id="content"> <!---stat content--->
<img class="set" src="images/main.jpeg.jpeg" alt="main.jpeg.jpeg, 866B" title="main.jpeg" border="0" height="47" width="940">
<img class="foot" src="images/bg_column_wrapper.gif.gif" alt="bg_column_wrapper.gif.gif, 697B" title="bg_column_wrapper.gif" border="0" height="34" width="940">
</div> <!---end content--->
</div> <!---end wrapper-->
</div>
</body>
</html>
CSS:
/* CSS Document */
html, body {
background: none repeat scroll 0 0 rgb(0,51,255);
color: #666666;
font-family: Arial,Helvetica,sans-serif;
}
body {
font-size: 81.25%;
margin: 0px;
}
#header{
background: url(../images/header2.gif.gif) no-repeat center center;
height:290px;
width:100%;
}
#wrapper{
width:940px;
margin: 0 auto 0 auto;
text-align: left;
background:rgb(255,255,255);
}
img.set{
position:relative; top:-67px;
}
img.foot{
position:relative;
}
#content {
}
#footer {
}
/***Typography***/
h1{
background:url(../images/title.gif.gif) no-repeat;
height:94px;
width:607px;
position:relative;top:46px;left:60px;
}
h1 a{
display:block;
height:144px;
text-indent:-9999px;
}
/***Menu******************************/
ul.nav {
padding-right: 0px;
width: 100%;
float:left;
margin: 20px 20px 20px 20px;
text-indent: 10px;
position:relative;bottom:75px;
}
ul.nav li {
list-style:none;
float:left;
width:14.285%;
text-align: center;
font-size: 1.5em ;
}
ul.nav li a{
display: block;
line-height:1.5em;
padding: 0px 10px 0px 10px;
font-size: 90%;
font-weight: bolder;
text-decoration: none;
text-transform: none;
color:rgb(255,255,255);
}
ul.nav li a:hover
{color:rgb(0,0,0);}
Problém je že obrázok main.jpeg mi vôbec nezobere v IE, ďalej IE ignoruje moje nastavenie šírky stránky a jej zarovnanie....ďakujem veľmi za každý nápad a pomoc!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="generator" content="PSPad editor, www.pspad.com">;
<link rel="stylesheet" href="css/index.css" type="text/css">
<title>SOSAUTO</title>
</head>
<body>
<div style="width: 940px; margin-left: auto; margin-right: auto;">
<div id="header"> <!---start header-->
<h1><a href="#">sosauto.eu</a></h1>
</div> <!---end header-->
<div id="wrapper"> <!---start wrapper-->
<ul class="nav">
<li><a href:"#">O nás</a></li>
<li><a href:"#">Poradňa</a></li>
<li><a href:"#">Download</a></li>
<li><a href:"#">Inzercia</a></li>
<li><a href:"#">Kontakt</a></li>
</ul>
<div id="content"> <!---stat content--->
<img class="set" src="images/main.jpeg.jpeg" alt="main.jpeg.jpeg, 866B" title="main.jpeg" border="0" height="47" width="940">
<img class="foot" src="images/bg_column_wrapper.gif.gif" alt="bg_column_wrapper.gif.gif, 697B" title="bg_column_wrapper.gif" border="0" height="34" width="940">
</div> <!---end content--->
</div> <!---end wrapper-->
</div>
</body>
</html>
CSS:
/* CSS Document */
html, body {
background: none repeat scroll 0 0 rgb(0,51,255);
color: #666666;
font-family: Arial,Helvetica,sans-serif;
}
body {
font-size: 81.25%;
margin: 0px;
}
#header{
background: url(../images/header2.gif.gif) no-repeat center center;
height:290px;
width:100%;
}
#wrapper{
width:940px;
margin: 0 auto 0 auto;
text-align: left;
background:rgb(255,255,255);
}
img.set{
position:relative; top:-67px;
}
img.foot{
position:relative;
}
#content {
}
#footer {
}
/***Typography***/
h1{
background:url(../images/title.gif.gif) no-repeat;
height:94px;
width:607px;
position:relative;top:46px;left:60px;
}
h1 a{
display:block;
height:144px;
text-indent:-9999px;
}
/***Menu******************************/
ul.nav {
padding-right: 0px;
width: 100%;
float:left;
margin: 20px 20px 20px 20px;
text-indent: 10px;
position:relative;bottom:75px;
}
ul.nav li {
list-style:none;
float:left;
width:14.285%;
text-align: center;
font-size: 1.5em ;
}
ul.nav li a{
display: block;
line-height:1.5em;
padding: 0px 10px 0px 10px;
font-size: 90%;
font-weight: bolder;
text-decoration: none;
text-transform: none;
color:rgb(255,255,255);
}
ul.nav li a:hover
{color:rgb(0,0,0);}
Problém je že obrázok main.jpeg mi vôbec nezobere v IE, ďalej IE ignoruje moje nastavenie šírky stránky a jej zarovnanie....ďakujem veľmi za každý nápad a pomoc!