サイドバイサイドdivs

-1

このフォーラムhttp://python-forum.org/pythonforum/をご覧になった場合は、トピックと投稿のdivが持つボーダーが短いことに気付くでしょう。私はフォーラムを書いていて、横に並んでいなければならないブロックに問題があります（上記フォーラムの4人のように）。 4つのブロックを並んで配置して、私のフォーラムがそんなに短くないように助けてください。サイドバイサイドdivs

出典

2009-09-03 Anonymous

あなたは、いくつかのより詳細な情報を与えることができますか？いくつかの矢印が付いたスクリーンショットが役立つかもしれません。私はちょうどあなたが短く言っているものを得られない。 – jantimon

これを見てくださいhttp://savepic.ru/834672.png –

これは、あなたが要求している<dd>要素のCSSスタイルです：

UL.topiclist DD 
{ 
    PADDING-RIGHT: 0px; 
    DISPLAY: block; 
    PADDING-LEFT: 0px;  
    FLOAT: left; 
    PADDING-BOTTOM: 4px; 
    BORDER-LEFT: #ffffff 1px solid; 
    PADDING-TOP: 4px 
}

横並びがFLOAT: left;でそれを得るための重要な1。

短い縦線は、ちょうどborder-leftです。

出典

2009-09-03 07:44:34 awe

あなたのフロートで 'display：inline'をお勧めします。 floatは暗黙的にブロックされているため、これは基本的に無視されます。これはIEのためのものです。そうしないと、ダブルマージンのバグが発生します。 http://www.positioniseverything.net/explorer/floatIndent.html – Funka

@awe：はい、短い縦線はボーダー左です。それは短いです。 –

@Sweetie：なぜそれが短いのか疑問に思うなら、 '

'要素が「行」の完全な高さにないことだけです。どのようにHTMLソースが表示されているかを確認する必要があります。 – awe

テーブルを使用する必要があります。

テーブルの使用が許可されるケースはほんのわずかです（セマンティックhtmlルールに従う場合）。これは1つです。フォーラムの概要、投稿数と閲覧数、最後のポスターなどは表形式のデータです。テーブルを使用することは安全で完全に容認されます。

<dl>要素は、このように使用することを意図していませんでした。

出典

2009-09-03 14:28:45

私もそう思います。ありがとう！ –

次の2つのdiv要素が横並びになりたい場合は、インラインブロックを使用して試みることができる：

<style> 
    #div1, #div2 { 
     display: inline-block; 
    } 
</style> 

<div id="wrapper"> 
    <div id="div1"></div> 
    <div id="div2"></div> 
</div>

出典

2012-12-04 12:04:37

サイドバイサイドdivs

答えて

関連する問題