2

FF または Chrome で自動高さを機能させることができません。IEでは問題なく動作しますが、FFとChromeでは、コンテンツが要素を埋めていない場合でも、基本的にdivの高さをページ自体と同じくらいにします。実際のコンテンツの下に巨大な空白領域が残るだけです。 

<center>
    <div id = "choosearea">
        <div id = "logbar">
            <div id = "logbartext">Choose Your Area
            </div>
        <div id = "log">
          <a href = "?action=home">Home</a>   
          <a href = "?action=logout&NOHEADERS=1">Log Out</a>
        </div>
    </div>
    <div id = "header">
        <div id = "ss_logo">
          <img src="http://i1157.photobucket.com/albums/p595/Gamethefirst/ssnewbanner1.png">
        </div>
        <div id = "area">Serving:<br><u>SouthWest Ohio<br>Northern Kentucky<br>SouthEast Indiana</u>
        </div>  
    </div>
 <center>
    <div id = "menu">
    </div>
 </center>
    <div width = "100%" align = "center">
      <div id = "paddingbox">
        <div id = "chooseareatext">
          <p>Choose the area which you reside from the options below in order to post/view your ad.</p>
          <ul class = "bullets">
           <li><a href = "?board=swohio">SouthWest Ohio</a></li>
           <li><a href = "?board=nk">Northern Kentucky</a></li>
           <li><a href = "?board=indi">SouthEast Indiana</a></li>
          </ul>
        </div>
        <div id = "affs">
          <h3>Need Supplies? Get Great Deals From Our Friends!</h3>
        </div>
      </div>
    </div>
  </div>
</center>

スタイルシート

#choosearea {
    height: auto;
}

以下に例を示します: http://skillswap.boards.net/index.cgi?board=postad

4

2 に答える 2

1

CSSのheightデフォルト値はauto. それが非常に長くなる原因となっているのはheight:100%onであり、FF と Chrome で大きな空白領域が作成されます。それを削除すると、問題が解決するはずです。#paddingbox<div>

また、例のマークアップの一部は、HTML 仕様の新しいバージョンでは無効であるか、非推奨です。

たとえばwidth="100%"、有効な属性ではありません。インライン スタイルを適用する正しい構文は次のとおりです。<div style="width:100%">

<center>タグとalign="center"属性も HTML 4.01 から非推奨になり、HTML 5 には存在しません。代わりに、CSS を使用してマークアップにプレゼンテーションの側面を追加することをお勧めしmargin:0 autoますtext-align:center。HTML で <center> タグが廃止される理由を参照してください。詳細については、こちらをご覧ください。質問には既にスタイルシートがあるため、コンテンツ (HTML) とプレゼンテーション (CSS) を分離すると役立つ場合があります - http://www.alistapart.com/articles/separationdilemma/

于 2012-09-13T13:38:22.153 に答える
0

これを body スタイルで書きます。

position: absolute;
于 2013-03-10T05:46:54.670 に答える