Removing Unordered List Indentation with CSS

When text in an unordered list wraps around, unwanted indents may appear. To address this issue, try the following steps:

1. Remove Indentation

Delete the default padding and list-style indent:

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

2. Decrease Line-Height

If necessary, reduce the line-height by setting it equal to the font size, or slightly less:

ul li {
    line-height: 1em;
}

3. Disable Float

Remove any float properties applied to list items, ensuring they display inline-block instead:

ul li {
    float: none;
    display: inline-block;
}

4. Adjust Font Size

As a final step, adjust the font size to your desired appearance.

Example

Consider the following code:

#info {
    ...
}

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

#info ul li {
    float: none;
    display: inline-block;
    line-height: 1em;
}
This combination of techniques should eliminate the indentation from wrapped lines in unordered lists, ensuring a clean and professional appearance.