HTML list items are spoiled little brats. On surface you can't do anything with them other then list some items in a document. But when styled well with CSS, they can become your ultimate weapon.A list is very useful when you don't know in advance how many items are there gonna be. It could be a few or hundreds.Here is an example of using list items in my last application.It's also being used in WordPress sidebar widgets.Let's start with a basic un-ordered list in CSS:ul { /* My style goes here.. */}But if I target the global ul tag, then all the list items will be changed, so why not use a class instead?I will use a .list class throughout this article. Here's the html: Lorem ipsum dolor sit amet Nisi ut aliquip ex ea commodo consequat Duis aute irure dolor in reprehenderit Ut enim ad minim veniam, quis nostrud Culpa qui officia deserunt mollit animIt will look like this in the browser:The first thing you wanna do is to make it lose its default appearance, by getting rid of the the bullets and removing the spacing:.


I guess you came to this post by searching similar kind of issues in any of the search engine and hope that this resolved your problem. If you find this tips useful, just drop a line below and share the link to others and who knows they might find it useful too.

Stay tuned to my blogtwitter or facebook to read more articles, tutorials, news, tips & tricks on various technology fields. Also Subscribe to our Newsletter with your Email ID to keep you updated on latest posts. We will send newsletter to your registered email address. We will not share your email address to anybody as we respect privacy.


This article is related to

css,style,list-item,html,web-applications