同じ行に2つを作る方法<div>...</div>？

つまり、2つのタグの高さは同じです。同じ行に2つを作る方法<div>...</div>？

2010-12-02 Keating Wang

すべての部門にお試しください。

display:inline-block;

出典

2010-12-02 23:53:02

+1表示：インラインで十分な柔軟性がなく、フロートが乱雑です！ –

CSSでそれらをフロート

：

float: left

出典

2010-12-02 23:12:30 simshaun

彼らが浮くください：

HTML


<div class="container1"></div> 
<div class="container2"></div> 
<div class="clear"></div>

CSS


.clear { clear: both; } 
.container1, .container2 { float: left; }

あなたはフロートをクリアする必要があり

...そう使用両方をクリア：

出典

2010-12-02 23:14:53

シンプル：<span>を代わりに使用します。

<div>デフォルトではdisplay: blockであり、次の要素が改行になることを意味します。

display: inlineに変更して、適切な動作をさせることができます。しかし、インライン<div>はちょうど<span>です。

出典

2010-12-02 23:18:01

フロートがページセンターの配置を乱します。ここに私が持っているものがあります、私は2と3を同じ行にページセンタリングを失うことなく得たいです。私はブラウザのサイズを変更すると、それと一緒に動くので、フロートは動作しません。

<head> 
<meta http-equiv="Content-Language" content="en-us"> 
<style type="text/css"> 
.div1 { 
    background: #faa; 
    width: 500; 
} 

.div2 { 
    background: #ffc; 
    width: 400; 
    margin-right: 100px; 
} 
.div3 { 
    background: #cfc; 
    width: 100; 
    margin-left: 400px; 

} 


</style> 
</head> 

<html> 
<body> 
<center> 

<div class="div1"> This is no 1</div> 
<div class="div2"> This is no 2</div> 
<div class="div3"> This is no 3</div> 

</center> 
</body> 
</html>

出典

2014-02-10 04:35:18

divコンテナを使用してすべてのdivを配置します。

.div_container{ 
    display: flex; 
    flex-direction: row; 
}

これは簡単です！

出典

2017-11-14 17:54:49 Abraxas

同じ行に2つを作る方法<div>...</div>？

答えて

関連する問題