March 3, 2012

Quit "tab" from ul with css

Question by matt

The list on html have by default a “tab” for each item that I want to erase.

HTML code:

<h2>list title</h2>
<ul>
    <li>item one</li>
    <li>item two</li>
    ...
    <li>item n</li>
</ul>

this is the css I have:

.notstyled{list-style-type:none;}

and looks like (the “|” will be like the edge of the screen):

|list title
|
|    item one
|    item two
|    ...
|    item n
|

what I’m looking for will be having the list items at the edge, like this:

|list title
|
|item one
|item two
|...
|item n
|

I know the example is very stupid..

Thanks in advance!

Answer by Starx

Clear the padding of the ul

ul { padding: 0; }

Just in case, you dont like the outer spacing of the ul clear the margin or padding as well.

ul {
    padding: 0;
    margin: 0;
}

Author: Nabin Nepal (Starx)

Hello, I am Nabin Nepal and you can call me Starx. This is my blog where write about my life and my involvements. I am a Software Developer, A Cyclist and a Realist. I hope you will find my blog interesting. Follow me on Google+

...

Please fill the form - I will response as fast as I can!