CSS Examples 
Markerless and “no indent” Lists
Author: CSS Drive
Removing the default marker that appear to the left of lists is useful when you wish to use lists purely for semantic reasons or to fully customize visually. The below CSS removes both the marker and changes the indentation of the list so it's inline with normal content. The combination of "padding: 0" and "margin-left: 0" ensures the indentation is consistent across browsers.
- News
- Sports
- Technology
- Webmaster
The HTML:
<ul>
<li>News</li>
<li>Sports</li>
<li>Technology</li>
<li>Webmaster</li>
</ul>
The CSS:
ul{
list-style-type: none;
padding: 0;
margin-left: 0;
font-weight: bold;
}
Comments (5)
gdfg
gfdgfdg
doesn't work on me. the bullets are gone yet the whole list is still indented. I've tried to use this:
li{ list-style-type: none; padding: 0; margin-left: -25px;}
well, i'm still searching for the best solution on this. im planning to have it hovered.
li a:hover { }
i'll post on this soon..
Hey Richard use this code:
ul {
list-style: none;
margin-left: 0;
padding-left: 1em;
text-indent: -1em;
}
It works for me now. If used the same code as presented in this site it did not work because my list wasn't inside a DIV.
Regards.
Ooops the DIV I mentioned has nothing to do with the list indent.
