html cssを使用してリストを縦向きにする方法

Question

私は<div>に追加したいリストがあります。各リスト項目には<div>が含まれ、画像とテキスト文字列が含まれます。リストは垂直でなければなりません。私は<ul>のdisplay:blockをwidth:100%と入れてみましたが、リストは左から右へ水平に流れています。リストを垂直にするにはどうしたらいいですか？

Answer 1

ではなく<ul>

Answer 2

の<li>タグでdisplay: blockを入れてみてください、私はLIのCSSにこれを追加します

.list-item 
{ 
    float: left; 
    clear: left; 
} 

Answer 3

・ホープこれはあなたの構造です：デフォルトでは

<ul> 
    <li> 
     <div ><img.. /><p>text</p></div> 
    </li> 
    <li> 
     <div ><img.. /><p>text</p></div> 
    </li> 
    <li> 
     <div ><img.. /><p>text</p></div> 
    </li> 
    </ul> 

、別の行の後に1つ追加します：

----- 
----- 
----- 

あなたはそれを垂直にしたい場合は、単にフロートを追加するには、コンテンツの幅を壊さないであろうことを確認して、幅と高さを与え、李に左：

| | | 
| | | 

li 
{ 
    display:block; 
    float:left; 
    width:300px; // adjust 
    heigh:150px; // adjust 
    padding: 5px; //adjust 
} 

Answer 4

CSS

li { 
    display: inline-block; 
} 

作品私にとっても。