Adding a region over first sidebar

Hi,

For your layout here is what we need to do
we will have to print three different divs in the page.tpl.php to get the required layout.
1)First div will be highlighted region
2)In the Second div print the new region ,first sidebar and content
3) And the third div will be the second sidebar

Here is the sample of code that you could use in your page.tpl.php

<div id="main-wrapper"><div id="main" class="clearfix<?php if ($primary_links || $navigation) { print ' with-navigation'; } ?>">
    <?php if ($highlight): ?>
       <div id="highlight"><?php print $highlight; ?></div>
     <?php endif; ?>

    <div id="content" class="column"><div class="section">
        <?php if ($new_region): ?>
           <div id="new-region"> <?php print $new_region; ?></div>
         <?php endif; ?>
	  
     <?php if ($sidebar_first): ?>
         <div id="sidebar-first"> <?php print $sidebar_first; ?></div>
      <?php endif; ?>
    
        <?php if ($mission): ?>
          <div id="mission"><?php print $mission; ?></div>
        <?php endif; ?>

        <?php print $breadcrumb; ?>
          <?php if ($title): ?>
            <h1 class="title"><?php print $title; ?></h1>
          <?php endif; ?>
        <?php print $messages; ?>
          <?php if ($tabs): ?>
            <div class="tabs"><?php print $tabs; ?></div>
          <?php endif; ?>
        <?php print $help; ?>

        <?php print $content_top; ?>

        <div id="content-area">
          <?php print $content; ?>
        </div>

        <?php print $content_bottom; ?>

        <?php if ($feed_icons): ?>
          <div class="feed-icons"><?php print $feed_icons; ?></div>
        <?php endif; ?>

    </div></div> <!-- /.section, /#content -->
  
     <?php if ($sidebar_second): ?>
          <div id="sidebar-second"><?php print $sidebar_second; ?></div>
      <?php endif; ?>

</div></div> <!-- /#main, /#main-wrapper -->

Then using firebug you can give the css (i.e width, margin and padding)

Here is the sample css

 .two-sidebars #content {
  margin-left:0px;
  margin-right:0px;
  width: 735px;
}

#main-wrapper ,#main, #highlight {
  float: left;
  width: 100%;
}

.region-sidebar-second {
  float:left;
  margin-left:0px;
  margin-right:0px;
  padding:0;
  width:200px;
}

#new-region, #sidebar-first {
  float: left;
  width: 100%;
}

#sidebar-first {
  width: 200px;
}

.region-sidebar-first {
  float:left;
  margin-left:0;
  margin-right:0px;
  padding:0;
  width:200px;
}

#content-area {
  float: left; 
  width: 531px;
}  

#sidebar-second {
  float: left;
  width: 221px;
}

.with-navigation #content, .with-navigation .region-sidebar-first, .with-navigation .region-sidebar-second {
  margin-top:0;
}

Thanks,
Komal

As far as I can see, this would require knowing beforehand the height of the highlight region, then using the same technique applied to Zen's navigation region. I wouldn't know how to do it otherwise, unless we start heavily changing the markup.