Re: Cross-browser problem
Try changing the positioning from absolute to relative.
Re: Cross-browser problem
Soo, I did this but I still have two row navigation for me. How you see it?
Re: Cross-browser problem
Hi there Mr.Joker,
this is how I would code it...
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta name="author" content="Aleksandar Arsic">
<meta name="description" content="Web sajt Visoke tehnicke skole strukovnih studija u Pozarevcu">
<meta name="keywords" content="Visoka skola, Tehicka skola, Strukovne studije, Pozarevac,
Visoka tehnicka skola, Visoka tehnicka skola strukovnih studija u Pozarevcu">
<title>Visoka tehnicka skola strukovni studija Pozarevac</title>
<style type="text/css">
body {
background-color:#f5f5f5;
font-family:'trebuchet ms',sans-serif;
}
#main {
width:1100px;
height:742px;
padding-top:158px;
margin:30px auto;
border:1px solid #000;
border-radius:10px;
box-shadow:0 0 20px #666;
background-color:#fff;
background-image:url(http://www.dodaj.rs/f/11/nx/4NlzHX9I/logo.png);
background-repeat:no-repeat;
background-position:140px 0;
}
#navigation {
border-top:1px solid #999;
border-bottom:1px solid #999;
margin:0 0 20px;
padding:0;
list-style:none;
background-color:#ccc;
text-align:center;
}
#navigation li {
display:inline-block;
}
#navigation a {
display:inline-block;
padding:4px 7px;
text-decoration:none;
color:#fff;
}
#navigation a:hover{
background-color:#98b9df;
}
#navigation2 {
width:1056px;
height:130px;
margin:0 auto;
padding:0;
list-style:none;
}
#navigation2 li {
float:left;
padding:0 2px;
}
#navigation2 a {
display:block;
width:172px;
}
#navigation2 img {
display:block;
width:170px;
height:128px;
border:1px solid #000;
opacity:0.7;
}
#navigation2 img:hover {
opacity:1.0;
}
</style>
</head>
<body>
<div id="main">
<ul id="navigation">
<li><a href="#">Pocetna strana</a></li>
<li><a href="#">O Skoli</a></li>
<li><a href="#">Pravna akta</a></li>
<li><a href="#">Nastavni planovi</a></li>
<li><a href="#">Zaposleni</a></li>
<li><a href="#">Studije</a></li>
<li><a href="#">Publikacije</a></li>
<li><a href="#">Upis</a></li>
<li><a href="#">Savez Studenata</a></li>
<li><a href="#">Asocijacije</a></li>
<li><a href="#">Korisni linkovi</a></li>
</ul>
<ul id="navigation2">
<li><a href=""><img src="http://www.vts-pozarevac.edu.rs/Pics/zupcanici.jpg" alt="zupcanici"></a></li>
<li><a href=""><img src="http://www.vts-pozarevac.edu.rs/Pics/electricity.jpg" alt="electricity"></a></li>
<li><a href=""><img src="http://www.vts-pozarevac.edu.rs/Pics/eco.jpg" alt="eco"></a></li>
<li><a href=""><img src="http://www.vts-pozarevac.edu.rs/Pics/poljop.jpg" alt="poljop"></a></li>
<li><a href=""><img src="http://www.vts-pozarevac.edu.rs/Pics/Konz.gif" alt="Konz"></a></li>
<li><a href=""><img src="http://www.vts-pozarevac.edu.rs/Pics/manag.gif" alt="manag"></a></li>
</ul>
</div>
</body>
</html>
Re: Cross-browser problem
This look great. Can you tell me the little seacrets you used? Like what you used where and why you did that. I see the code work fine everywhere, but I need to learn to do it alone next time. Can't get all from code.
Re: Cross-browser problem
Quote:
Originally Posted by
Mr.Joker
Soo, I did this but I still have two row navigation for me. How you see it?
Are you referring to the double spaced line that is between the pictures and the navigation bar when viewing the page in fire-fox?
Re: Cross-browser problem
