IE9 스크롤있는 박스의 높이가 늘어나는 현상
dev | 2013-03-14
IE9에서 overflow: auto
로 스크롤이 생긴 박스안의 링크를 클릭하면 박스 아래에 여백이 생기는 버그가 있다는 질문을 하신 분이 있어서 분석을 해봤다.
<!DOCTYPE html>
<html lang="en">
<head>
<title>IE9 scrolled box's height expending</title>
</head>
<body>
<div style="width: 200px; overflow: auto;">
<div style="width:500px;">
<a href="#">test</a>
</div>
</div>
FAIL if this text moves down after click link.
</body>
</html>
해결책은 스크롤이 생긴 박스에 margin-top: auto
와 같이 아무 방향으로 margin
값을 auto
로 지정하면 된다.
<div style="width: 200px; overflow: auto; margin-top: auto">
Comments