私はテンプレートを使用しているので、htmlとcssではそれほど良くはありませんが、私はそれを使用しようとしています。ユーザーテストが新しい行に実際に見ることができるようにここで div整列の問題
は問題 http://i53.tinypic.com/dmw6yt.jpgの画像です。それはそうではない方法です。このテキスト「ユーザXのアカウント統計」と同じ行にあるはずです。
私が使用してHTMLとCSSは<div>
インライン要素は、あなたが落ちるその後、同じ行に表示したいテキストのような要素のためのものである
<div class="user">Account stats for user<div class="info">test</div></div>
div.user
{
font-size: 13px;
text-align: center;
}
div.info
{
font-size: 18px;
}
自動的に同じ行にしたい場合は、代わりに<span>を使用することをおすすめします。
<span class="user">Account stats for user</span><span class="info">test</span>
そして、あなたは絶対に、その後のdivを使用する必要がある場合：CSSで
<div class="user">Account stats for user</div><div class="info">test</div>
を：
div.user
{
font-size: 13px;
text-align: center;
}
div.info
{
font-size: 18px;
float:left;
}
使用のインライン要素<span>の代わりに、ブロック要素です十分なスペースが残っていない場合、前のインライン要素より下に下がります。ブロック要素は、サイトの構造に使用するためのものです。
どちらかの代わり<div>の<span class="info">を使用し、またはこれらのCSSを使用します。
div.info
{
font-size: 18px;
display: inline-block;
}
通常はspanを使用して好むはずですが、あなたは要素の幅を指定したい場合は、いくつかの例（例があります）にはdivが必要です。あなたの場合は、spanに行ってください。
DIVが自動的ので、新しい行を割り当てためですそれは「ブロックレベル」要素です。このような状況では、<div>の<span>のすべてを、インライン要素であるため交換します。
この動作を無効にするには、<div>のCSS属性display:inlineを使用することもできます。
はこれを試してみてください：
div.user
{
font-size: 13px;
text-align: center;
display: inline;
}
div.info
{
font-size: 18px;
}
は、私は、これはトリックを行うと思います。
'display：inline;'を追加できます。それらに働くはずです。
また、それらを両方とも左に浮かべることもできますが、おそらくはうまくいくでしょう。 'float：left;'
"test"という単語を新しいdivに入れます。これは、この言葉が新しい行にあることを意味します。 divの代わりにclassまたはidでspanを使用してみてください。あなたは本当に言葉のためのdivを使用したい場合はだからあなたのdiv.infoクラスが見えるはずです「テスト」あなたは、floatプロパティまたはインライン表示div.info
display: inline;
内部
<div class="user">Account stats for user<span class="info">test</span></div>
.info
{
margin-left: 10px;
font-size: 18px;
}
プットこれを割り当てることができますこのように
div.info
{
font-size: 18px;
display: inline;
}
このQはほとんどの同一回答 – Kelly