엄지 손가락을 적절하게 중심으로하는 작은 블록 그리드
-
21-12-2019 - |
문제
3 개의 엄지 손가락을 가지고 있습니다. 나는 연속적으로 가운데를 가고 싶습니다.코드는
입니다 <div class="large-12 columns">
<ul class="small-block-grid-3">
<li><img class="shadow" src="img/thumbs/carWashHome.jpg"></li>
<li><img class="shadow" src="img/thumbs/homeCleanHome.jpg"></li>
<li><img class="shadow" src="img/thumbs/carpetCleanHome.jpg"></li>
</ul>
</div>
.
그러나 어쨌든 엄지 손가락은 중앙에 아닌 왼쪽부터 시작됩니다. 그 문제를 해결하는 방법을 제안 할 수 있습니까? 여기에 그림이 있습니다
링크는 링크
엄지 손가락이 왼쪽으로 떠있는 것을 볼 수 있습니다. 그들을 중심으로하는 방법. 고마워.
해결책
다음을 다음과 같이 바꿉니다
<div class="large-12 columns" style="text-align: center;">
.
키는 style="text-align: center;"
를 추가하는 것입니다. 문제가 해결됩니다
다른 팁
URL을 게시 해 주셔서 감사합니다.
text-align:center;
.small-block-grid-3 > li{}
를 추가하기 만하면됩니다.
우려가 있는지 알려주세요.
CSS
.small-block-grid-3 > li{
text-align:center;
}
. 이 CSS를 이미지 태그에 추가합니다.
display: block;
margin-left: auto;
margin-right: auto;
.
center
태그에있는 li
에 이미지가 정렬됩니다.
는 그 재단이 필요에 따라 요소에 적용 할 수있는 "Text-Center"라는 CSS 클래스도 가지고 있습니다. -)
<div class="text-center">
content goes here...
</div>
. 제휴하지 않습니다 StackOverflow