html - 如何去掉 UL 左边的空格？

Question

好的，为了解释这一点，我在此处制作了一个可访问的 JSFiddle:JSFiddle

我想删除 UL 左侧的间距，我尝试删除列表样式，但这行不通。任何帮助表示赞赏。 谢谢。

ul li {
    list-style: none;
    display: inline;
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
}

Answer 1

从列表本身移除填充，而不仅仅是列表内的元素。

ul {
  padding: 0;
}

body {
  margin: 0 0 0 0px;
}
#header {
  background-color: #141414;
  height: 50px;
  width: 100%;
}
#wrapper {
  width: 100%;
  font-size: 0px;
}
#footer {
  background-color: #141414;
  width 100%;
  min-height: 200px;
}
ul li {
  list-style: none;
  display: inline;
  margin: 0 auto;
  padding: 0;
  list-style-type: none;
}
ul {
  padding: 0;
}
.galleryimg {
  width: 20%;
  margin: 0 auto;
}

<div id="header">

</div>
<div id="wrapper">
  <ul>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>

    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
    <li>
      <img class="galleryimg" src="http://placehold.it/500x500"></img>
    </li>
  </ul>
</div>
<div id="footer">
  sup m8
</div>