0

私はこのページの「私たちについて」ヘッダーに取り組んでいます

<h1>...</h1>基本的に、画像と青い「About Us」ブロックを含む小さな div は画像でしたが、SEO の目的で、タグを使用できる構造に置き換えています。

ご覧のとおり、画像とヘッダー タグのレイアウトは完全に機能していますが、ページの右側の列がコンテンツの下に押し込まれています。

私は確認し、再確認しましたが、すべてのフロートが適切に含まれているように見えます (何かを見逃していない限り)。これを修正する方法がわかりません。

ここで私が間違っていることを誰かに教えてもらえますか?

HTML:

<div class="page_header">
    <div>
        <img src="http://sela.netgendns.co.za/wp-content/uploads/2012/11/sela-about-us-1.jpg">
        <img src="http://sela.netgendns.co.za/wp-content/uploads/2012/11/sela-about-us-2.jpg" alt="" />
        <img src="http://sela.netgendns.co.za/wp-content/uploads/2012/11/sela-about-us-3.jpg" alt="" />
        <h1>About Us</h1>
    </div>
</div>

CSS:

/* Page Headers
----------------------------*/
.page_header div {
   overflow: hidden;
    min-width: 665px;
}

.page_header img, .page_header h1 {
 float: left;
 margin: 10px 10px 0 0;        
}

.page_header img:nth-child(2) {
    clear:right;
}

.page_header h1.about-us {
 line-height: 90px;
 background: #00f;
 color: #fff;
 padding: 0 42px;
}

前もって感謝します!

4

2 に答える 2

0

Hey Ortund 実は HTML マークアップを少し不適切な方法で書いたので、次のように書くべきです :-

<div id="main">
<div id="content">
<div id="sidebar-primary">
</div>

この方法で正常に動作する添付画像を参照してください:-

ここに画像の説明を入力

于 2012-12-07T10:07:07.540 に答える
0

これは、要素<div id="sidebar-parimary">内に存在する必要があるためです。<div id="main">

現在は次のとおりです。

  <div id="main">
    <div id="content">...</div>
  </div>

  <div id="sidebar-primary">..</div>

そのはず:

  <div id="main">
    <div id="content">...</div>
    <div id="sidebar-primary">..</div>
  </div>
于 2012-12-07T09:49:43.897 に答える