li 요소를 사용해 리스트를 만드는 중 눈에 거슬리는 부분이 생겼다.
한 줄을 벗어나 2줄이 되더니 정렬이 어긋나버린것
바로 이렇게 말이다. 이걸 고치고 싶어서 어떻게 해야하나 고민하다 구글링을 했다.
stackoverflow에서 찾은 답변은 text-indent와 padding을 같이 사용하라는 것.
체크 아이콘은 fontawesome에서 갖다 썼는데 저 속성 값이 font-awesome에 의해 .fa-fw에 설정된 너비이기 때문에 사용된다고 한다. (아이콘이 나랑 달라서 애초에 나는 저 속성이 바로 안먹혔나봄)
li {
padding-left: 1.28571429em;
text-indent: -1.28571429em;
}이 속성을 적용하니 확실히 전 보다 좀 더 들어갔다.
그래도 완벽히 들어가지 않은게 너무 거슬린다....
두 속성의 정수 값을 2로 바꿔 줌
이젠 너무 들어갔음..
text-indent 값의 첫 번째 소수점 값을 1로 바꿈
확실히 나아진 모습을 볼 수 있음. 그래도 여전히 거슬림...
일단 다른거 다하고 여기로 다시 돌아와야겠음 처음이랑 비교하면 완전 괜찮아짐😊
