CSS 인라인-블럭 마진 질문 입니다.

조회수 1987회

안녕하세요. django에서 랜더링한 이미지를 inline-block으로 이미지 갤러리처럼 배열 했습니다. 그런데 컨테이너 div안의 엘리먼트들을 중앙정렬하고 싶은데 방법을 모르겠네요 ㅠㅠ

이미지

HTML:

<div class="align">
    <ul>
        <li><img src="이미지"></li>
    </ul>
</div>

CSS:

    .align {
    display: inline-block;
    width: 125px;
    height: 130px;
    margin: 0 10px 0 10px;
    vertical-align: top;
}

위처럼 CSS를 적용했는데요 위의 이미지처럼 가운데 정렬이 되지 않고 줄바꿈 되면서 맨 오른쪽 공백이 생기고 맨 왼쪽 마진도 적용이 되질 않습니다.

아래 이미지처럼 이미지 엘리먼트들이 중앙정렬 되게 하려면 어떻게 CSS를 적용해야 할까요??

이미지

  • (•́ ✖ •̀)
    알 수 없는 사용자

1 답변

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)