HTML Forum

**sonsyphon** · 09:34 PM

I'm currently experimenting with the layout of my website but there's a problem I'm trying to resolve.

The website needs to exist with and without advertisements, as shown in the examples

With ads
without ads

I want the DIVS en TABLES to adjust in width when advertisements are shown. The text after the advertisements needs to be shown on the whole page and because of that, my problem occurs. As you can see the DIV and TABLE continious underneath the advertisement.

HTML CODE

Code:

<div id="content">
  <div class="ads_160x600_content"><img src="layout/images/ads.gif" alt="ads" /></div>
  <div style="background-image:url(layout/images/titlebar.gif); background-repeat:no-repeat">    
    <div style="position:relative; height:25px;">    
      <div style=" float:left; background:#fff; margin-left:20px; padding:0px 5px 0px 5px;">
    <h1><?php echo $_content_title[$_GET['content']][$_GET['lang']]; ?></h1>
      </div>            
    </div>
    <?php include 'content_navigation.php'; ?>
  </div>
  <div class="after_float"></div>
</div>

CSS CODE

Code:

#content {
  border: 1px solid #08699c;         
  float:right;
  padding: 3px;
  width:781px;
}

.ads_160x600_content {
  position: relative;
  background-color:#fff;
  float: right;
  width: 160px;
  height: 600px;
  padding-left:3px;
  top:0px;
  right:0px;

}

.after_float {
  clear:both;
}