If you want to create an unordered list in HTML (<ul>) that lists items horizontally while maintaining the bullets this bit of code should help you. This method is more flexible than display: inline, display: inline-block or float: left, allowing you to control the styles used for the bullet.

The last CSS selector will remove a bullet from the first item, which is ideal in for design in some circumstances. If you want the first item to include a bullet just remove the .list-horizontal li:first-child:before styles.

About the Author

Kevin Leary is a freelance web developer in Boston, MA specializing in enterprise WordPress development, conversion optimization and JavaScript development.