html - How can we remove space between two li? -


i have following html:

<ul class="navlist">     <li><a href="index.html">home</a></li>     <li><a href="agenda.html">agenda</a></li>     <li><a href="presenters.html">presenters</a></li>                        </ul> 

and i'm using css:

.navlist {       padding: 10px 0 0;     margin: 0;     list-style-type: none;     height: 33px; }  .navlist li {        text-decoration: none;     font-size: 18px;     color: white;     background: #63b3e4;     padding: 10px 45px 12px; }  .navlist li a:hover {     color: #63b3e4;     background: white; }  .navlist li {display: inline;} 

as shown in fiddle, there whitespace between li elements. how remove whitespace?

the reason set li inline eelements, spaces caused "spaces"/linebreaks between html code </li> , <li>.

we make li float: left instead:

http://jsfiddle.net/lsbwt0n8/3/


Comments

Popular posts from this blog

jquery - How do you format the date used in the popover widget title of FullCalendar? -

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -