shanenin Posted September 22, 2006 Report Share Posted September 22, 2006 I am just trying to make the start of a navigation bar. I can't seem to figure out why my boxes have margins inbetween them. I would like them to be touching(no margins). here is the code I have<html><head><title>my nav bar</title><style type="text/css">ul { list-style-type: none; }li { display: inline; border-style: solid; border-width: 1px; padding: 2px; margin: 0px;}</style><head><body><ul> <li>home</li> <li>hair services</li> <li>massage</li></ul> </body></html> Quote Link to post Share on other sites
jsbowen Posted September 22, 2006 Report Share Posted September 22, 2006 You are trying to make your code look too neat Code all the <li>'s on one line:<ul> <li>home</li><li>hair services</li><li>massage</li></ul> Quote Link to post Share on other sites
shanenin Posted September 22, 2006 Author Report Share Posted September 22, 2006 (edited) thanks, that works :-)Do you know the explanation why it was not working the way I had it? I thought I have seen code examples that made it work with the same style I used.edit added later//I think the answer to my question is this. The default behavior is to add a space whenever a newline is started. Edited September 22, 2006 by shanenin Quote Link to post Share on other sites
jsbowen Posted September 22, 2006 Report Share Posted September 22, 2006 I was going to try to explain it, but found someone who had explained it much better:Every line break in the HTML source (I'm talking about newline character, not <li> or <br> tag) is treated just like a space character. Normally, each <li> is shown on a separate line (block mode), so that implicit space does not have an effect. Your styles sheet overrides the display to inline mode (display:inline), so the implicit space becomes visible.Second post:http://www.webmasterworld.com/forum83/3063.htm Quote Link to post Share on other sites
shanenin Posted September 22, 2006 Author Report Share Posted September 22, 2006 Thanks. That forum looks like a nice place to learn. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.