Different between body { overflow hidden; } and #div { overflow hidden; }
i have a problem with overflow:hidden
and the body tag.
Here is a little exmaple
Body version (dont work)
<body style="border: 1px solid #ff0000; width:100%; height:200px; overflow:hidden;">
<div style="width:50px; height:50px; border: 1px solid #0000ff; position:absolute; top-10px;"></div>
</body>
http://jsfiddle.net/5hGSp/13/
DIV version (works)
<div style="border: 1px solid #ff0000; width:100%; height:200px; overflow:hidden;">
<div style="width:50px; height:50px; border: 1px solid #0000ff; position:absolute; top-10px;"></div>
</div>
http://jsfiddle.net/5hGSp/12/
What is the problem? When you 开发者_StackOverflowclick (middle mousekey) into the red area -> the mouse-software start the scrollfunction.... but only in the "body version" !
Hope someone can help me.Thanks in advance!
Peter EDIT: Sry, it is very hard to me to explain it in english. But i try it again. 1) Copy the code into an .*html file. 2) Open the file and click (middle mousekey) into the body tag (red area). 3) Did the mousescroll function start? ...did you see an scroll icon (for example from the logitech software?) 4a) if not, everything works fine 4b) you see the icon? You know how to disable? -> write a comment pls<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
body {
border: 1px solid #ff0000;
width:100%;
height:200px;
overflow:hidden;
}
</style>
</head>
<body>
<div style="width:50px; height:50px; border: 1px solid #0000ff; position:absolute; top:-10px;"></div>
</body>
</html>
Nabab wrote:
Body is not a block element.
精彩评论