初心者なので、サイトの CSS に苦労しています。
いくつかの DIV とラッパーを使用してサイトを作成しましたが、内側の DIV のオーバーフローで外側の DIV (ラッパー) を引き伸ばすことができません。http://www.sitepoint.com/examples/clearing_floats/example2.phpを見 たことがありますが、自分の間違いを見ることができません。
前もって感謝します!
body {
text-align: center;
background: url(http://www.keenfuel.nl/v2/wb/templates/keenfuel/images/background.jpg)
}
#wrapper {
text-align: left;
width: 1250px;
padding: 0px;
margin: 0 auto;
height: 100%;
overflow:auto;
}
#logo {
position: absolute;
top: 50px;
right: 10px;
}
#header {
text-align:left;
width: 100%;
height: 155px;
position: relative;
background: url(http://www.keenfuel.nl/v2/wb/templates/keenfuel/images/body2_bg.fw_r1_c2.jpg);
padding-left: 4px;
z-index:9;
}
#menu {
text-align: left;
position: absolute;
bottom: 6px;
padding-left: 4px;
}
#headerimage {
text-align: left;
width: 100%;
height: 268px;
background: url(http://www.keenfuel.nl/v2/wb/templates/keenfuel/images/keenfuel_r2_c2.jpg);
}
#mainwrapper {
text-align:left;
width: 100%;
height: 488px;
background: url(http://www.keenfuel.nl/v2/wb/templates/keenfuel/images/body2_bg.fw_r 3_c2.jpg);
background-repeat: no-repeat;
}
#maincontent{
width: 800px;
height: 488px;
float: left;
padding-left: 15px;
font-family:Verdana, Geneva, sans-serif;
color: #000000;
}
#newscontent{
width: 360px;
heigth: 200px;
float: right;
margin-top: 20px;
background: url(http://www.keenfuel.nl/v2/wb/templates/keenfuel/images/news_background.fw.png);
overflow:hidden;
color: #000000;
padding-left: 15px;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
}
#footer {
height: 56px;
background: url(http://www.keenfuel.nl/v2/wb/templates/keenfuel/images/body2_bg.fw_r6_c2.jpg);
text-align: center;
font-family: Verdana, Geneva, sans-serif;
clear:both;
}
<div id="wrapper">
<div id=header><div id="logo"></div>
<div id="menu">
<?php show_menu2(0, SM2_ROOT, SM2_START, SM2_ALL, '<font color="#FFFFFF"> | [ac][menu_title]</a>', '', '', '', '[ac][menu_title]</a></font>'); ?>
</div>
</div>
<div id="headerimage"></div>
<div id="mainwrapper">
<div id="maincontent"><?php page_content(1); ?><br style="clear:both"/></div>
<div id="newscontent">
<?php
// customized cwsoft-anynews function call
$config = array(
'group_id_type' => 'section_id',
'display_mode' => 4,
'max_news_length' => 20,
);
echo getNewsItems($config);
?>
<br style="clear:both"/>
</div>
</div>
<div id="footer"><br /></div>