1

多くのコンテンツを含む固定サイズのページを書いています。これが、 にスクロールバーがある理由です (通常の動作)。スクロールバーの直後に要素を作成したいと思います。これにより、幅を変更できます（サイズを変更可能にします）。残念ながら、この要素 (「リサイザー」) は表示されていません。なぜ隠されているのですか？これが例のリンクです - http://jsfiddle.net/ZYBHN/。

<html>
<head>
  <style type="text/css">
   #wrapper {
    float: left;
    height: 200px;
    position:relative;
    overflow: hidden;
    padding-bottom: 1px;
    padding-right: 1px;
    width: 500px;
    z-index: 200;
   }
   #resizer 
   {
    border:1px solid red;
    cursor: e-resize;
    height: 100%;
    position: absolute;
    right: -10px;
    top: 0;
    width: 10px;
    z-index: 1000;
   } 
   #content
   {
     width:100%; 
     height:100%;
     overflow:auto;
     position:relative;
   }
  </style>
</head>
<body>
<div id="wrapper" > 
<div id="content"> 
.....Lots of text here....
</div>
<div id="resizer"></div>
</div>  
</body>
</html>
4

1 に答える 1

0

#resizerの中に要素があり#wrapper、 と がoverflow: hiddenありますposition: relative。#resizer絶対に、右から -10 ピクセルを基準にして配置しまし#wrapperた (つまり、その右はラッパー要素の外側にあります)。のoverflow: hiddenは#wrapper、これがその境界の外に表示されないようにしています。

于 2013-03-12T16:18:39.007 に答える