jQueryアコーディオン複数の要素を整列する

Question

こんにちは、jQueryのlibと私はちょうどスピードバンプをヒットした非常にクールな新しいです。私は3つの要素を表示したいと思います。 < h4>タグa < p> another tag < h4>タグはすべて< ul>内にあります。だから、見出しを開くとリストが表示され、それぞれの行には名前の説明と価格が表示されます。フロートを外しておけば、お互いの下に表示されます。

<div id="accordion"> 
<h3><a href="#">BBEEE Toolkit</a></h3> 
<div > 
    <ul> 
    <li><h4>Very Large Generic</h4><p>Revenue greater than 1.5 billion</p><h4>Proposal on request</h4></li> 
    <li><h4>Large Generic</h4><p>Revenue between 650 million and 1.5 billion</p><h4>67,980.00</h4></li> 
    <li><h4>Medium Generic</h4><p>Revenue between 250 million and 650 million</p><h4>45,322.00</h4></li> 
    <li><h4>Small-Medium Generic</h4><p>Revenue between 80 million and 250 million</p><h4>30,591.00</h4></li> 
    <li><h4>Small Generic</h4><p>Revenue between 35 million and 80 million</p><h4>21,031.00</h4></li> 
    <li><h4>QSE</h4><p>Revenue between 5 million and 35 million</p><h4>R14,340.00</h4></li> 
    <li><h4>EME</h4><p>Revenue less than R5 million</p><h4>660.00</h4></li> 
    <li><h4>Existing scorecard</h4><p>Upload an existing scorecard</p><h4>FREE</h4></li> 
    </ul> 
</div> 

と私のCSSは次のようになります。

#accordion { 
border: 2px solid #eee; 
border-radius: 0px 8px 8px 0px; 
width: 940px; 
height: 502px; 
margin: /*top and bottom */5px /*right and left*/auto; 
} 

#accordion h4 { 
font-size: 16px; 
} 

#accordion p { 
font-size: 16px; 

} 

私は名前の記載の価格に見えるように、それらを揃えるために何を行うことができ、そしてない

名

説明

価格

次へ

Answer 1

h4とpタグはブロック項目なので、デフォルトでは次の項目が下に移動するよう強制されます。 display: inlineを使用すると、それらの動作を異ならせることができます。

h4, p { 
    display: inline; 
} 

しかし、彼らは見出しを意味するので、あなたがh4タグを使用してはならないポイントにより

。このようなものがうまくいくでしょう。 <li><span class="name">name</span> description <span class="price">price</span></li>

Answer 2

私は私がちょうどサブソニック顔、手のひらを予め形成されたプロフェッショナルな外観