중앙에 정렬
본문
사진과 같이 좌측으로 쏠려 있는것을 아래와 같이 가운데 넣고 싶은데 무슨코드를
추가해야 하는지 고수님들 부탁 드립니다.
| 이렇게 cente에 넣고 싶어요 |
그리고 가능하면 이렇게 2개씩 넣고 싶거든요.
고수님들 부탁 드립니다.
| center | center |
| center | center |
| center | center |
아래는 적용한 코드입니다.
<div class="col-3 col-12-medium">
<div class="sidebar">
<!-- Archives -->
<ul class="divided">
<div class="like-icons text-center">
<li>
<article class="box post-summary">
<a class="accordion-section-title" href="http://m.its.go.kr/mltm/map"><img src="images/a1.jpg" alt=" " /><div class="clearfix"></div>
</a>
<h3><a href="#">전국도로교통지도</a></h3>
</article>
</li>
<li>
<article class="box post-summary">
<a class="accordion-section-title" href="http://m.its.go.kr/mltm/cctv"><img src="images/a2.jpg" alt=" " /><div class="clearfix"></div>
</a>
<h3><a href="#">고속도로 및 국도CCTV</a></h3>
</article>
</li>
<li>
<article class="box post-summary">
<a class="accordion-section-title" href="http://m.its.go.kr/mltm/quick"><img src="images/a3.jpg" alt=" " /><div class="clearfix"></div>
</a>
<h3><a href="#">도로공사 및 사고정보</a></h3>
</article>
</li>
<li>
<article class="box post-summary">
<a class="accordion-section-title" href="https://accident.knia.or.kr/"><img src="images/a4.jpg" alt=" " /><div class="clearfix"></div>
</a>
<h3><a href="#">나의 과실비율 검색</a></h3>
</article>
</li>
<li>
<article class="box post-summary">
<a class="accordion-section-title" href="https://m.map.kakao.com/"><img src="images/a5.jpg" alt=" " /><div class="clearfix"></div>
</a>
<h3><a href="#">카카오 맵</a></h3>
</article>
<li>
<article class="box post-summary">
<a class="accordion-section-title" href="https://m.map.naver.com/"><img src="images/a6.jpg" alt=" " /><div class="clearfix"></div>
</a>
<h3><a href="#">네이버 맵</a></h3>
</article>
</li>
</li>
</ul>
</div>
답변 3
전체를 싸고 있는 DIV는 relative 나 absolute 같은 position 값을 줘서 margin : 0 auto 로 가로 가운데 정렬하고
안에 있는 li 는 각각 50%의 크기로 float : left 정렬하여주고 폰트는 text-align : center 정렬로 하면 끝.
float 정렬에 대한 초기화 :after { content:''; display:block; clear:both; } 처리 꼭 해주면 됨
지금 보여주신 코드로만은 정확한 답변을 드리기가 어렵습니다.
해당 주소를 남겨주시면 리방법을 더 쉽게 답변해드릴 수 있습니다.
