이미지 삭제 후 정렬
본문
이미지가 3개가 있습니다.
이미지 + 이미지 + 이미지
위의 이미지 중에서 하나를 삭제 했습니다.
"이미지 + 이미지" 좌측으로 배열이 되었는데..
가운데 정렬을 하려고 합니다.
어떻게 해야하나요.
감사합니다.
답변 4
어떻게 만들고 싶으신지 이미지가 없어서 애매하긴한데, 만약 위에 질문처럼 이미지 두개를 센터로 주고 싶으시다면 이렇게 고쳐주시면 되요
<style>
.business {
width:100%;
text-align:center;
}
.business:after {
content: "";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.business li {
display:inline-block;
}
</style>
<div class="business">
<ul>
<li class="wow fadeInUp">
<img src="<?php echo G5_THEME_URL;?>/html/business/image/01_1.jpg" alt="사업영역">
<h2>홈페이지 제작</h2>
<p>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.<br>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.
</p>
</li>
<li class="wow fadeInDown">
<img src="<?php echo G5_THEME_URL;?>/html/business/image/01_2.jpg" alt="사업영역">
<h2>쇼핑몰 제작</h2>
<p>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.<br>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.
</p>
</li>
</ul>
</div>
<div style="width:500px;text-align:center">
<img>
<img>
</div>
div를 감싸고 css 를 text-align:center 주면 센터로 갑니다.
아이티몬스님, 답변 감사합니다.
아래의 경우에는 어떻게 해야하나요?
<div class="business">
<ul>
<li class="wow fadeInUp">
<img src="<?php echo G5_THEME_URL;?>/html/business/image/01_1.jpg" alt="사업영역">
<strong>홈페이지 제작</strong>
<span>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.<br>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.
</span>
</li>
<li class="wow fadeInDown">
<img src="<?php echo G5_THEME_URL;?>/html/business/image/01_2.jpg" alt="사업영역">
<strong>쇼핑몰 제작</strong>
<span>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.<br>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.
</span>
</li>
</ul>
</div>
아이티몬스님, 답변 감사합니다.
잘 작동하고 있습니다.
추가질문 :: 아래의 부분을 <span> ~~ <span> 으로 하면 작동을 안합니다.
이유가 무엇이죠?
<p>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.<br>
이곳은 사업영역 간략설명글이 들어갈 자리입니다.
</p>