November 27, 2011
Unknown space between list item
Question by joomlearner
I am designing a simple joomla template. When I came to a very weird problem. Although, I didn’t gave any margin or padding, some spaces are appearing between the list items.
Here is a link to the fiddle. Click here
Can someone tell me what am i doing wrong?
Firebug shows nothings.
Answer by Starx
This doesn’t have anything to do with the joomla scenario. But this is default way the inline-blocks behave. They add about 4px margin to the right, automatically.
A quick fix of this is applying float:left to the list items
But, a similar question has been asked already and the answerer has provided with the better solution. i.e. closing and starting the li‘s in a same line
<ul>
<li>
<div>first</div>
</li><li>
<div>first</div>
</li><li>
<div>first</div>
</li><li>
<div>first</div>
</li>
</ul>
Furthermore, this might be worth reading as well.
