<ul id="list">
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
this show me:
aaa
bbb
ccc
How can i make:
aaa bbb ccc
what i must add for css?
Don't use float, no no. Use inline-block
HTML:
<ul id="list">
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ul>
CSS:
ul li {
display:inline-block;
background-color:#eee;
list-style-type:none;
margin-right:-4px;
padding:10px;
border-right:1px solid white;
}
Demo: http://jsfiddle.net/QPuTs/1/
If IE7 (put this in your <head>
tags)
<!--[if lte IE 7]>
<style>
ul li {
display:inline;
zoom:1;
}
</style>
<![endif]-->
Or alternatively in your external CSS like so:
ul li { display: inline-block; zoom: 1; *display: inline; }
You can use display:inline
#list li {
display:inline;
}
http://jsfiddle.net/btBdW/
Mention float:left
in li
#list li{
list-style-type:none;
float:left;
}
Working Code
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With