How to have fixed regions

[newcoder1010]

Hi,

 

I am developing the site in drupal. I have two regions top of the screen. I placed few blocks in the two regions. I simply like to place the both regions fixed position on the very top of the screen. So when I scroll down, all blocks in the two regions remains same. Now, it is working somewhat. Everything in the top two regions remain same when I scroll down but other blocks below the regions are overlapping. How can I place the two regions on top of screen fixed position without affecting anything on the page?

.region-main-verytop1 {  height: 100px; position: fixed; z-index: 1030; right: 0;  left: 0;   }
   .region-main-verytop2 {  height: 200px; position: fixed; z-index: 1030; right: 0;  left: 0; top: 100px; bottom: 90px;  }

Link to my site: http://godrupal.info

 

Please advise.

[COBOLdinosaur]

Setting position:fixed takes them out of the flow so the other elements move up to occupy the spavce that they have vacated. You will need to use margin top on the block below the regions to modify the position.

 

Any time you use fixed or absolute positioning there is going to be a price to pay. It is in general a terrible way to do layout. and forcing something fixed so it is always infront of the user may be a usability/accessibility issues depenfing on what the elements contain.