1 Problem with cross-browser coding Mon Aug 13, 2012 3:44 am
Mr.Joker
Mr. WebArtz
- Code:
<!--Web sajt je vlasnistvo Visoke tehnicke skole strukovnih studija u Pozarevcu-->
<html>
<title>Visoka tehnicka skola strukovni studija Pozarevac</title>
<head>
<style type="text/css">
body {
background-color:#f5f5f5;
font-family:"Trebuchet MS";
}
#main {
background-color:#ffffff;
width:1100px;
height:900px;
margin-left:auto;
margin-right:auto;
margin-top:30px;
border: 1px solid #000000;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-border-radius:10px;
}
#navigation {
border-bottom:1px solid #999999;
position:absolute;
width:1100px;
float:left;
margin: 0 0 0 0;
padding:0px;
list-style:none;
background-color:#cccccc;
margin-top:-9px;
}
#navigation li{
float:left;
}
#navigation li a{
display: block;
padding: 4px 10px;
text-decoration:none;
color:#ffffff;
}
#navigation li a:hover{
background-color:#98b9df;
}
#img1 {
margin-top:30px;
border:1px solid #000000;
margin-left:20px;
}
#img2 {
margin-top:30px;
border:1px solid #000000;
}
#img3 {
margin-top:30px;
border:1px solid #000000;
}
#img4 {
margin-top:30px;
border:1px solid #000000;
}
#img5 {
margin-top:30px;
border:1px solid #000000;
}
#img1:hover {
margin-bottom:10px;
}
#img2:hover {
margin-bottom:10px;
}
#img3:hover {
margin-bottom:10px;
}
#img4:hover {
margin-bottom:10px;
}
#img5:hover {
margin-bottom:10px;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div id="main">
<img style="margin-left:140px;" src="http://www.dodaj.rs/f/11/nx/4NlzHX9I/logo.png" border="0" title="logo"></img><hr />
<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>
<a href=""><img id="img1" src="http://www.vts-pozarevac.edu.rs/Pics/zupcanici.jpg"></img></a>
<a href=""><img id="img2" src="http://www.vts-pozarevac.edu.rs/Pics/electricity.jpg"></img></a>
<a href=""><img id="img3" src="http://www.vts-pozarevac.edu.rs/Pics/eco.jpg"></img></a>
<a href=""><img id="img4" src="http://www.vts-pozarevac.edu.rs/Pics/poljop.jpg"></img></a>
<a href=""><img id="img5" src="http://www.vts-pozarevac.edu.rs/Pics/Konz.gif"></img></a>
<a href=""><img id="img5" src="http://www.vts-pozarevac.edu.rs/Pics/manag.gif"></img></a>
</div>
</body>
</html>
Ok that is code. Problem is when I run it trough Chrome everything work great, but when I run it trough Mozilla firefox it's bad in many ways. How to work on it?