How To Move li Elements To The Left Side of ul  Element

To remove unwanted space in front of li elements, you need give value to padding property.

Let me illustrate with an example.

HTML

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</ul>

CSS

html {
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

body {
    padding: 0;
    margin: 0;
}

ul {
    width: 260px;
    margin: 250px auto;
    border: 2px solid #000;
}

li {
    display: inline-block;
    padding: 15px;
    color: #ddd;
    background-color: #FC255A;
    border: 1px solid #000;
    cursor: pointer;
}

This gives us.

move li to left side of ul

I have added border to ul element to highlight that li elements are pushed to the right.

To move li elements to the left side of ul element, you can add padding: 0 property to ul element.

ul {
    width: 260px;
    margin: 250px auto;
    border: 2px solid #000;
    padding: 0;
}
move li to ul left side

Or you can use universal selector to set padding to zero.

* {
    padding: 0;
}

This will give same result but remember universal selector (*) selects all elements in HTML. Therefore, all elements padding will be zero as well, not just ul element.