I was reading this article How to remove the space between list items, but did not help.
Can somebody help me how to remove spacing?
this is my code in html and css:
<header>
<div id="sign"><a href="#">Prijava</a> | <a href="#">Registracija</a></div>
<img id="logo" src="croglas-logo.png" width="200px" height="70px"/>
<nav>
<ul>
<li><input type="text" name="search" id="search"/></li>
<li>
<select id="category_search">
<option value="default">Pretraži po kategorijama</option>
<option value="alati">Alati</option>
<option value="antikviteti">Antikviteti</option>
<option value="automobili">Automobili</option>
<option value="bazeni">Bazeni</option>
<option value="biciklizam">Biciklizam</option>
<option value="bijela_tehnika">Bijela tehnnika</option>
<option value="eknjige">E-knjige</option>
<option value="gospodarska_vozila">Gospodarska vozila</option>
<option value="hardver">Hardver</option>
<option value="igracke">Igračke</option>
<option value="apps">Igre i aplikacije</option>
<option value="kamera">Kamera</option>
<option value="knjige">Knjige</option>
<option value="kuća">Kuća</option>
<option value="kućanski_aparati">Kućanski aparati</option>
<option value="mobiteli">Mobiteli</option>
<option value="motocikli_motori">Motocikli i motori</option>
<option value="namještaj">Namještaj</option>
<option value="obuca_djecja">Obuća dječja</option>
<option value="obuca_muska">Obuća – muška</option>
<option value="obuca_zenska">Obuća – ženska</option>
<option value="odjeca_djecja">Odjeća – dječja</option>
<option value="odjeca_muska">Odjeća – muška</option>
<option value="odjeca_zenska">Odjeća – ženska</option>
<option value="poljoprivreda">Poljoprivreda</option>
<option value="poslovni_prostor">Poslovni prostor</option>
<option value="printer">Printer</option>
<option value="racunala">Računala</option>
<option value="rucni_radovi">Ručni radovi</option>
<option value="satovi">Satovi</option>
<option value="sport">Sport</option>
<option value="stan">Stan</option>
<option value="suncane_naocale">Sunčane naočale</option>
<option value="tableti">Tableti</option>
<option value="torbe">Torbe</option>
<option value="tv">Tv</option>
<option value="udzbenici">Udžbenici</option>
<option value="vrtna_garnitura">Vrtna garnitura</option>
<option value="vrtna_oprema">Vrtna oprema</option>
<option value="zemljiste">Zemljište</option>
<option value="zvucnici/slusalice">Zvučnici/slušalice</option>
</select>
</li>
<li><input class="myButton" type="submit" value="pretraži"/></li>
<li><img src="#"/><span class="btn">PREDAJ OGLAS</span></li>
</ul>
</nav>
</header>
header{
width:100%;
height:100px;
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(47%,rgba(246,246,246,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
}
#sign{
border:1px solid black;
width:65%;
margin:0 auto;
text-align:right;
}
#sign a{
text-decoration:none;
}
#logo{
position:absolute;
}
nav{
width:65%;
margin:0 auto;
}
nav ul{
width:100%;
text-align:center;
float:left;
list-style:none;
padding:0;
border:1px solid black;
}
nav ul li{
display:inline;
}
#search{
width:380px;
height:35px;
border-radius:5px;
font-size:20px;
}
#search_results{
display:none;
}
#category_search{
width:170px;
height:35px;
border-radius:5px;
}
.myButton {
width:100px;
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
background-color:#f9f9f9;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #dcdcdc;
display:inline-block;
cursor:pointer;
color:#666666;
font-family:Trebuchet MS;
font-size:20px;
font-weight:bold;
font-style:italic;
padding:5px 8px;
text-decoration:none;
text-shadow:0px 1px 0px #ffffff;
}
.myButton:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
background:-moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
background:-webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
background:-o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
background:-ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
background-color:#e9e9e9;
}
.myButton:active {
position:relative;
top:1px;
}
.btn {
height:35px;
background: #c70a0a;
background-image: -webkit-linear-gradient(top, #c70a0a, #c40808);
background-image: -moz-linear-gradient(top, #c70a0a, #c40808);
background-image: -ms-linear-gradient(top, #c70a0a, #c40808);
background-image: -o-linear-gradient(top, #c70a0a, #c40808);
background-image: linear-gradient(to bottom, #c70a0a, #c40808);
-webkit-border-radius: 5;
-moz-border-radius: 5;
border-radius: 5px;
font-family: Arial;
color: #ffffff;
font-size: 20px;
padding:9px;
text-decoration: none;
cursor:pointer;
}
.btn:hover {
background: #f00808;
background-image: -webkit-linear-gradient(top, #f00808, #eb0c2a);
background-image: -moz-linear-gradient(top, #f00808, #eb0c2a);
background-image: -ms-linear-gradient(top, #f00808, #eb0c2a);
background-image: -o-linear-gradient(top, #f00808, #eb0c2a);
background-image: linear-gradient(to bottom, #f00808, #eb0c2a);
text-decoration: none;
}