`webkit-box`要素の高さが変化する

-3

情報項目を表示するために、無限のスクロール可能な行を作成しようとしています。`webkit-box`要素の高さが変化する

私は以下のように設定しました。これは、アイテムをホルダーと同じサイズにしています。私はインラインブロックを使用しようとしましたが、項目を1つの列に表示します：

更新：リンクはアイテムの下部に表示する必要がある要素です。アイテムからタグを完全に削除します。私はまた、垂直方向の疲れを持っています。

ご迷惑をおかけして申し訳ございません。

.holder { 
 
    overflow-x: scroll; 
 
    overflow-y: visible; 
 
    height: 550px; 
 
    width: 100%; 
 
    padding: 0; 
 
} 
 
.item_row { 
 
    display: -webkit-inline-box; 
 
    list-style: none; 
 
    padding: 0; 
 
} 
 
.item { 
 
    width: 300px; 
 
    background: #fff; 
 
    margin: 0 10px 0 10px; 
 
}

<div class="holder"> 
 
    <div class="item_row"> 
 
    <div class="item"> 
 
     <!-- Info --> 
 

 
<a href="#" class=""> need to appear at bottom </a> 
 
    </div> 
 
    </div> 
 
</div>

出典

2016-09-11 Kez

あなたはディスプレイ 'を使用しますか： -webkit-inline-box; '？ – Anselm

実際に何をしようとしていますか？ – Nit

いいえ、Anselm、私は 'display：-webkit-inline-box;'を使いたくないのですが、私の質問で 'display：inline-block;更新しました。 – Kez

これは、今のあなたのソリューションです。あなたがアイテムにコンテンツを持っていないと、なぜリンクが下に行くのですか？ -webkit - 私が持っている理由インラインボックスの作業のみクロームザッツはあなたの.item-行クラスに2つの余分な表示を追加ハッピー楽しむと幸運コーディング

.holder { 
    overflow-x: scroll; 
    overflow-y: visible; 
    height: 550px; 
    width: 100%; 
    padding: 0; 
} 
.item_row { 
    display: -webkit-inline-box; 
    display: -moz-inline-box; 
    display: -ms-inline-box; 
    list-style: none; 
    padding: 0; 
    } 
.item { 
    width: 300px; 
    background: #fff; 
    margin: 0 10px 0 10px; 
} 


<body> 
<div class="holder"> 
    <div class="item_row"> 
    <div class="item"> 
    <!-- Info --> 
    <img src="http://cdn.online-convert.com/images/image-converter.png"  
    alt="test"> 
    <h1>test</h1> 
    <p>test</p> 
    <p>test</p> 
    <a href="#" class=""> need to appear at bottom </a> 
</div> 
<div class="item"> 
    <!-- Info --> 
<img src="http://cdn.online-convert.com/images/image-converter.png" 
    alt="test"> 
    <h1>test</h1> 
    <p>test</p> 
    <p>test</p> 
     <a href="#" class=""> need to appear at bottom </a> 
    </div> 

    </div> 

</div> 

</body>

出典

2016-09-11 22:55:49

`webkit-box`要素の高さが変化する

答えて

関連する問題