ここで、私がやったことは終わりです。問題を直接解決するのではなく、いくつかの修正プログラムを追加しました。
まず第一には、ここではいくつかの観測は：
我々は#columnが長いビューポートより大きい場合、#columnの長さは<body>の高さを指定する必要があることを知っています。
#columnがビューポートより短い場合、ビューポートの高さは<body>の高さを指定する必要があります。
コンテンツの長さにかかわらず、すべての状況下で列がページの下部まで伸びる必要があります。我々はheight: autoが<body>に設定されていることを確認する必要がある最初の基準については
。 Heightこれが設定されていない場合はこれを無効にします。また、#columnにheight: auto;とoverflow: hidden;があることを確認して、コンテンツのサイズに拡大させる必要があります。
position: absolute;とmin-height: 100%;を<body>に設定する必要があります。 <body>の長さは、#columnがそれより長い場合には拡大されますが、ビューポートよりは短くなりません。この次の部分は、修正が入ってくる部分です。
第3の基準については、いくつかの特別なCSSを追加して、特別なCSSを追加することです。私のHTMLでは、#columnのすぐ外に2つのdivを追加しました。外のdivのために
<div id="colhack-outer">
<div id="colhack-inner">
</div>
</div>
<div id="column">
...
</div>
あなたは絶対にそれをpostiionし、それが100％までの高さ、代替ボックスモデルを使用して、パディングを使用してコンテンツ領域だシフトすることを強制します設定します。すべての列のスタイリング（背景色、ボーダー半径、シャドウなど）を内側のdivに適用します。ここで私はそれらに適用されるCSSは次のとおりです。
#colhack-outer {
height: 100%;
padding: <where you want to shift the column to>;
position: absolute;
width: 50%;
}
#colhack-inner {
height: 100%;
width: 100%;
background-color: #303030;
}
あなたはまた、あなたの実際のコンテンツコンテナがその特別なボックスモデルを使用して作成し、あまりにもパディングでそれをシフトする必要があります。ここに
#contentbox {
position: relative;
padding: <where you want to shift the column to>;
width: 50%;
color: #EEEEEC;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
ライブ例：http://nerdhow.net/
ご質問がある場合や、不明な点がある場合は、コメントを投稿してください。
http://nerdhow.net/（これはフロントページです）の '＃contentcolumn'は'＃wrapper'に対応し、 '.region-content'は' #content'に対応します – enthdegree
私は私が欲しいものをよりよく説明するためにイメージ。 – enthdegree
min-heightの使用を検討しましたか？これは、内容の内容にかかわらず、コンテンツdivの最小の高さを設定することを可能にします。その後、お客様のニーズに合わせて拡張されます。 – Paragon