Mozilla 한국 커뮤니티

div영역에서 이미지를 bottom 으로 하고 싶은데..어떻게 하는지??
테이블 에서는 valign="bottom" 으로 하면 되는데..


<div style="width:100px; height:100px; border:1px solid;">
<a href="#"><img src="http://wstatic.naver.com/w5/nxt2.gif" width="44" height="10" alt="더보기"></a>
</div>


여기에서는 어떻게 하는지..알려주세요.

을 시도해 보세요.

hyeonseok wrote:

Code: Select all

<img src="http://wstatic.naver.com/w5/nxt2.gif" width="44" height="10" style="bottom: 0;" alt="더보기"></a>
</div>

img의 style에 position: absolute;도 추가해주세요.

------ HTML -------
<div id="wrap">
<div id="mainmenu"><h1>메인메뉴</h1></div>
<div id="submenu"><h1>서브메뉴</h1></div>
<div id="content">컨텐츠</div>
</div>

----- CSS ---------
/* wrap */
#wrap {
width: 750px;
height: 0 auto;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 2px solid #9DB9BE;
background: url(../img/이미지.gif) bottom left no-repeat #FFF;/*이미지*/
}

/* main menu */
#mainmenu {
width: 100%;
height: 80px;
border-top: 3px solid #9DB9BE;
border-bottom: 1px solid #9DB9BE;
}

/* sub menu */
#submenu {
float: left;
width: 163px;
}

/* content */
#content {
margin-left: 165px;
width: 555px;
height: 800px;/*높이를 변경해서 확인해보세요*/
padding: 20px 10px 20px 15px;
border-left: 1px solid #9DB9BE;
background: #FFF;
}

-------------------------------------

위의소스대로 넣어서 확인해보세요 content 부분에 높이에 따라 좌측 서브메뉴의 높이도 변경되며 아래쪽에 붙이고 싶은 이미지도 스크롤바에 따라 제일 하단으로 위치합니다. 실제로 이미지를 넣고 확인해보세요 ^^