정렬되지 않은 목록 항목에서 들여 쓰기를 제거하는 방법?

정렬되지 않은 목록 항목에서 들여 쓰기를 제거하는 방법?

---

에서 들여 쓰기를 모두 제거하고 싶습니다 ul. margin에 padding, text-indent을 (를) 설정하려고 0했지만 아무 소용이 없습니다. text-indent음수로 설정 하면 트릭이 수행되는 것처럼 보이지만 실제로 들여 쓰기를 제거하는 유일한 방법입니까?

---

목록 스타일과 왼쪽 여백을 아무것도 설정하지 마십시오.

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>

글 머리 기호를 유지하기 위해 list-style: nonewith list-style-position: inside또는 단축을 대체 할 수 있습니다 list-style: inside.

ul {
  list-style-position: inside;
  padding-left: 0;
}

ul {
  list-style-position: inside;
  padding-left: 0;
}

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

---

<ul> 들여 쓰기를 제거하는 가장 좋은 해결책은 간단한 CSS one-liner입니다.

ul { padding-left: 1.2em; }

<p>A leading line of paragraph text</p>
<ul>
    <li>Bullet points align with paragraph text above.</li>
    <li>Long list items wrap around correctly. Long list items wrap around correctly. Long list items wrap around correctly. Long list items wrap around correctly. Long list items wrap around correctly. </li>
    <li>List item 3</li>
</ul>
<p>A trailing line of paragraph text</p>

이 솔루션은 경량 일뿐만 아니라 여러 가지 장점이 있습니다.

• <ul>의 글 머리 기호를 주변의 일반 단락 텍스트에 잘 맞 춥니 다 (= <ul> 들여 쓰기 제거).
• <li> 요소 내의 텍스트 블록이 여러 줄로 줄 바꿈되면 올바르게 들여 쓰기 된 상태로 유지됩니다.

---

레거시 정보 :
IE 버전 8 이하의 경우 margin-left를 대신 사용해야합니다.

    ul { margin-left: 1.2em; }

---

이것을 CSS에 추가하십시오 :

ul { list-style-position: inside; }

그러면 li 요소가 다른 단락 및 텍스트와 같은 들여 쓰기로 배치됩니다.

참조 : http://www.w3schools.com/cssref/pr_list-style-position.asp

---

당신은 링크를 제공 할 수 있습니까? 감사합니다. CSS 선택기가 충분히 강하지 않거나 시도해 볼 수 있습니다.

padding:0!important;

---

패딩을 제거하십시오.

padding-left: 0;

---

display:table-row; 또한 들여 쓰기를 제거하지만 글 머리 기호를 제거합니다.

---

나는 나누려고하는 바닥 글과 같은 문제가 있습니다. 위의 몇 가지 제안을 결합하여 나에게 도움이되었다는 것을 알았습니다.

footer div ul {
    list-style-position: inside;
    padding-left: 0;
}

이것은 내 h1 아래에서 왼쪽으로 유지하고 총알은 왼쪽 외부가 아닌 div 내부에서 유지하는 것으로 보입니다.

---

라이브 데모 : https://jsfiddle.net/h8uxmoj4/

ol, ul {
  padding-left: 0;
}

li {
  list-style: none;
  padding-left: 1.25rem;
  position: relative;
}

li::before {
  left: 0;
  position: absolute;
}

ol {
  counter-reset: counter;
}

ol li::before {
  content: counter(counter) ".";
  counter-increment: counter;
}

ul li::before {
  content: "●";
}

원래 질문은 요구 사항에 대해 명확하지 않기 때문에 다른 답변에서 설정 한 지침 내 에서이 문제를 해결하려고했습니다. 특히:

• 목록 글 머리 기호를 외부 단락 텍스트와 정렬
• 동일한 목록 항목 내에서 여러 줄 정렬

또한 사용할 패딩 양에 동의하는 브라우저에 의존하지 않는 솔루션을 원했습니다. 완전성을 위해 정렬 된 목록을 추가했습니다.

---

이 인라인을 수행하여 여백을 0 (ul style = "margin : -0px")으로 설정했습니다. 글 머리 기호는 돌출부가없는 단락과 정렬됩니다.

참고 URL : https://stackoverflow.com/questions/13938975/how-to-remove-indentation-from-an-unorder-list-item