これは最初の問題で機能するはずです。
<div id="maindiv">
<div id="innerdiv1" style="height:200px;">
few dynamic controls here
</div>
<div id="innerdiv2" style="height:50px">
This div should be just above footer.
</div>
</div>
編集:
htmlとcssに関するこれらの基本的なチュートリアルを確認することをお勧めします。
http://www.w3schools.com/
http://www.w3schools.com/html/default.asp
http://www.w3schools.com/css/default.asp
これは、編集した問題に対して機能するはずです。
divタグの上にある「ここにあるいくつかのコントロール」がコンテンツを押し下げているように見えます。これはdivタグ内に配置する必要があります。それを望まない場合は、それらのコントロールをdivでラップし、それに設定された高さを与えることができます。
<div style="width: 800px; height: 400px;">
<div style="height: 230px;">
few more controls here
<!-- this content should be inside the div if you want the content to stay fixed.-->
<bpcms:cmseditableregion runat="server" id="cms1" regiontitle="Content2" regiontype="HtmlEditor" required="false" />
</div>
<div style="height: 50px; width: 800px; border: 2px solid #99CC00; font-size: 13px;color: #ffbb33; overflow: hidden; padding: 5px 20px 5px 20px;">
<bpcms:cmseditableregion runat="server" id="cms2" regiontitle="Content1" regiontype="TextBox" required="false" />
</div>
</div>
これは、よりクリーンな方法である可能性があります。
<style>
.outer {
width: 800px;
height: 400px;
background-color:#eee;
}
.top {
height: 230px;
background-color:#fee;
}
.bottom {
height: 50px;
/*height actually 64px when including border and padding*/
width: 800px;
/*width actually 844px when including border and padding*/
border: 2px solid #99CC00;
/* padding adds 2 px to all sides for a total of 4px */
font-size: 13px;color:
#ffbb33;
overflow: hidden;
padding: 5px 20px 5px 20px;
/* padding adds 5px to top and bottom for a total of 10px
* padding adds 20px to left and right sides for a total of 40px */
background-color:#fee;
}
</style>
<div class="outer">
<div class="top">
few more controls here
<bpcms:cmseditableregion runat="server" id="cms1" regiontitle="Content2" regiontype="HtmlEditor" required="false" />
</div>
<div class="bottom">
<bpcms:cmseditableregion runat="server" id="cms2" regiontitle="Content1" regiontype="TextBox" required="false" />
</div>
</div>