0

私は現在、自分の Web ページの一部をデザインしている最中ですが、以下に示すように連絡先カードを配置するのに苦労しました。

ここに画像の説明を入力

現在、連絡先カードの 2 列目は、次のマークアップ構造のため、垂直方向に整列されていません。これ<h2 class="text200 margbottom margtop">Contact Us</h2>は、最初のグリッド 4 の他の 2 枚の接触カードを垂直に押し下げていますが、もちろん、2 番目のグリッド 4 に<h2>は存在しないため、これは発生していません。HTML マークアップを修正して、上の画像に示すように、連絡先カードを同じ高さに配置して水平方向に配置する方法はありますか?

ここにリンクがあります: http://www.bestcastleintown.co.uk/pg/

<div class="grid_4">
    <h2 class="text200 margbottom margtop">Contact Us</h2>
    <div class="contact_block_tiny trophy clearfix">
    <!-- content -->
    </div>
    <div class="contact_block_tiny target clearfix">
    <!-- content -->                                                
    </div>
</div>      
<div class="grid_4 omega">
    <div class="contact_block_tiny drink clearfix">     
    <!-- content -->                                    
    </div>
    <div class="contact_block_tiny editorial clearfix"> 
    <!-- content -->                                        
    </div>
</div>
4

1 に答える 1

1

「お問い合わせ」は最初の列の見出しですか、それとも両方の列の見出しですか? それが両方の列の見出しである場合、なぜ最初の列に入れるのですか? それは意味的に属する場所ではなく、結果としてレイアウトを壊します。

于 2013-04-15T09:13:46.380 に答える