help with creating regions

Hi ,
I created preface_first, preface_middle and preface_last regions in my zen sub theme on my local site.
1. Added following line of code in myzen.info (myzen - name of my zen's subtheme)

regions[preface_first]  = Preface first
regions[preface_middle] = Preface middle
regions[preface_last]   = Preface last 

2. Added following code in page.tpl.php after <div id="main-wrapper"><div id="main" class="clearfix<?php if ($primary_links || $navigation) { print ' with-navigation'; } ?>"> this line and before this <div id="content" class="column"><div class="section"> line.
Code to be added in page.tpl.php :

<?php if ($preface_first): ?>     
  <div id="preface-first"><?php print $preface_first; ?></div>
<?php endif; ?>

<?php if ($preface_middle): ?>     
  <div id="preface-middle"><?php print $preface_middle; ?></div>
<?php endif; ?>

<?php if ($preface_last): ?>     
  <div id="preface-last"><?php print $preface_last; ?></div>   
<?php endif; ?>

3. Css for above regions:
3.a. Added following line of code in myzen.info

 stylesheets[all][]   = css/myzen.css 

3.b. Created new file i.e. myzen.css in theme's '/css' directory and added following css code in it -

#navigation {
 float:left;
 height:2.3em;
 margin-left:0;
 margin-right:-100%;
 margin-top:5px;
 padding:0;
 width:100%;
}

#preface-first {
 float:left;
 margin-right:10px;
 width:32%;
 border: 1px solid red;
}

#preface-middle {
 float:left;
 margin-right:10px;
 width:32%;
 border: 1px solid red;
}

#preface-last {
 float:left;
 width:32%;
 border: 1px solid red;
}

#content {
 clear: left;
}

Please clear the cached data. Check the attachment to see the regions on my local site.

Rgrds,

Deepika Chavan.

Thank you for the solution Deepika.
What is the reason for creating a new CSS file (per directions in #1 3.b.) and not just modifying the already provided CSS files?
The #navigation is already declared in layout-fixed.css.

Hi Weka,
We can modify the core files but it is not a good practice. Instead we can create a new custom file and override the core css without touching it, this is what I believe. I am happy that you found my solution useful.

Rgrds ,

Deepika Chavan.

I was only referring to the CSS files inside my sub theme, I did not realize these are considered core files. I thought that was the whole reason for creating a sub theme so the files copied into the sub theme can be modified without making any changes to the main Zen theme files. Now I am a bit confused.

Hi Weka,
I apologies for making you confused. But as there are many css files, instead of making changes in different files we should make our custom css so that we will get our css changes in one file, this is my opinion. You can make changes in your custom theme.

Rgrds,

Deepika Chavan.

That is a good point.
Thank you for clarifying.