1

私はとを持っていoverflow-x:scrollますoverflow-y:hidden。画像がありますが、横にスクロールするだけで動かないのですか?画像をハイライトしてハイライトを下にドラッグすると、垂直方向に下にスクロールします。

#contents
{
margin:0 auto;
text-align:center;
width:1200px;
clear:both;
}

#image_contents
{
float:left;
height: 208px;
overflow-x:scroll;
overflow-y:hidden;
margin:0 auto;
}

.images 
{
float:left;
margin:2px;
background:#000;    
overflow:hidden;
position:relative;
display:inline-block;
}

<div id="contents">
<div id="image_contents">

    <div class="images">
        <img src="1.jpg"/>
    </div>

    <div class="images">
         <img src="2.jpg"/>
    </div>

    <div class="images">
          <img src="3.jpg"/>
    </div>

    <!-- and so forth !->
</div>
</div>
4

1 に答える 1

0

私の知る限り、これを行う最良の方法は、div内に別のdivを作成することimage_contentsです。次に、このdivにすべての画像の幅を指定します(必要に応じてJavaScriptを使用)。

別の解決策は、。を使用display:table-cellして別のdiv内の画像で使用することdisplay:table-rowです。

または(あえて言うと)を使用しtableます。

于 2012-07-15T21:54:43.077 に答える