html - 2 div を 1 行に保持するにはどうすればよいですか?

Question

ニュース バナーとボタンを 2 つの別個<div>の要素として作成しましたが、2 行で表示されます。

それらを一行にまとめたいのですが、どうすればいいですか？

HTML:

<div id="outer">
    <div>
        <div>
            <div id="newsbar">news bar</div>
            <div id="button"><span role="button"> <input type="button" value="submit"/></div>
        </div>
    </div>
</div>

フィドル。

Answer 1

これを試して、

<table>
<tr>
<td width="200px" align="center">
<div id="outer">
<div id="newsbar"></div></td>
<td>
<div id="button"><span role="button"> <input type="button" value="submit"/></div></td>
</div>
</tr>
</table>

ur divを小さなテーブルにするだけです..

Answer 2

    display:inline-block

#div1{float:left}

#div2{float:right}

Answer 3

あなたのCSSに追加してみてください

float: left; 

と

display: inline-block; 

それはそれを修正する必要があります。

Answer 4

使用するよりも、2 div 分のスペースがある幅を使用してください

フロート: 左;

これにより、divが隣り合わせに配置されます。もちろん、選択した他の方向を使用できます

Answer 5

どうぞ。

http://jsfiddle.net/alaminopu/ZKKFU/15/

HTML:

<div id="outer">
    <div id="news-wrap">
        <div>
            <div id="newsbar"></div>
            <div id="button"><span role="button"> <input type="button" value="submit"/></div>
        </div>
    </div>
</div>

CSS:

#news-wrap{
    overflow:hidden;
}
#newsbar{
    float:left;
    width:200px;
}

Answer 6

これを試して。 デモ

div
{
    display:inline-block;
    float: left;
}