Removing Ul Indentation with CSS

Removing ul indentation with CSS

This code will remove the indentation and list bullets.

ul {
    padding: 0;
    list-style-type: none;
}

http://jsfiddle.net/qeqtK/2/

How to remove indentation from an unordered list item?

Set the list style and left padding to nothing.

ul {
    list-style: none;
    padding-left: 0;
}

ul {  list-style: none;  padding-left: 0;}

<ul>  <li>a</li>  <li>b</li>  <li>c</li></ul>

Remove indentation from an unordered HTML list

Removing default padding-left (this indention ensures that the markers won't be pushed outside the list ) from ul and custom padding from li should work:

.content ul.searchlist { padding-left : 0; }
.content ul.searchlist li { padding : 10px 0; }

JSFiddle

CSS Can't remove indentation from a bulleted list

You have an error in your HTML.

<ul class=:wp-block-categories wp-block-categories-list">

should be

<ul class="wp-block-categories wp-block-categories-list">

As for your CSS, one of these is the most likely:

The li may have a margin as well. try .entry-content ul li { margin-left: 0; }
Your selector isn't specific enough, try .entry-content ul.wp-block-categories-list instead
Your ul may have margin instead of padding (doubtful)

You can try and diagnose these with DevTools/your browsers inspector, it will show you all of the positions/margins/paddings and everything related to the element's bounding box: screenshot of dev tools

Remove li indentation

Browsers ship a default styling attached to <ul/> and <li/> tags

ul,li { list-style-type: none;
        list-style-position:inside;
        margin:0;
        padding:0; }

http://meyerweb.com/eric/tools/css/reset/

How to remove indentation of list items

You are not selecting the ul to remove all its styles. Try this:

ul.homepageNavButtonsList {
    margin-left: 0;
    padding-left: 0;
    list-style: none;
}

You had .homepageNavButtonsList ul with padding-left: none and of course you didn't have any ul inside the .homepageNavButtonsList

CSS set li indent

to indent a ul dropdown menu, use

/* Main Level */
ul{
  margin-left:10px;
}

/* Second Level */
ul ul{
  margin-left:15px;
}

/* Third Level */
ul ul ul{
  margin-left:20px;
}

/* and so on... */

You can indent the lis and (if applicable) the as (or whatever content elements you have) as well , each with differing effects.
You could also use padding-left instead of margin-left, again depending on the effect you want.

Update

By default, many browsers use padding-left to set the initial indentation. If you want to get rid of that, set padding-left: 0px;

Still, both margin-left and padding-left settings impact the indentation of lists in different ways. Specifically: margin-left impacts the indentation on the outside of the element's border, whereas padding-left affects the spacing on the inside of the element's border. (Learn more about the CSS box model here)

Setting padding-left: 0; leaves the li's bullet icons hanging over the edge of the element's border (at least in Chrome), which may or may not be what you want.

Examples of padding-left vs margin-left and how they can work together on ul: https://jsfiddle.net/daCrosby/bb7kj8cr/1/

Removing Ul Indentation with CSS