채택완료
<li> 태그 안에 <img> 태그를 넣은 경우, 상단으로 붙는데..
수직적으로 가운데 쯤 위치하게 하려면 어떻게 스타일을 줘야 하나요?

대충 아래 형식처럼 스타일을 줬는데 가운데로 안 붙네요.
<style>
.side li a img {
vertical-align: middle;
max-height: 25px;
max-width: 26px;
}
</style>
<ul class=side>
<li><a href=링크 주소><img src=이미지 주소></a></li>
</ul>
글자는 가운데 위치하는데, 왜 이미지는 위로 붙을까요?
|
답변 4개 / 댓글 2개
채택된 답변
+20 포인트
2014-11-26 (수) 21:03:50
img에 padding-top을 사용해 보세요.
답변에 대한 댓글 1개
2014-11-26 (수) 21:15:32
2014-11-27 (목) 17:34:43
.side {width:150px; display:table;border:1px solid #ddd;margin:0px auto;}
.side li {width:100%;height:500px;line-height:500px;display:table-cell;text-align:center;vertical-align:middle;}
수정해보세요 ^^
2014-11-27 (목) 17:23:11
2014-11-27 (목) 14:35:13
.side {width:150px;display:table;}
.side li {width:100%;height:500px;text-align:center;display:table-cell; vertical-align:middle;}
.side li a{}
.side li {width:100%;height:500px;text-align:center;display:table-cell; vertical-align:middle;}
.side li a{}
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.
무조건 vertical-align 줘서 정렬시킬 생각밖에..ㅎ 근데, 자동으로 정렬시키는 법은 전혀 없는가요?