This is the same as Example 8, except that this time I've added positioned containers at the top and bottom of the message container.  In order to do this, I need to change the top and bottom edges of the message container to make room for the smaller containers.  In this example, I changed the top edge to 150 and the bottom edge to 100.

 

For the smaller top container, I inserted a new positioned container sized at 275 pixels wide by 200 pixels high.  For the horizontal layout position I selected to center it.  For the vertical position layout I set it at 50 pixels from the top.

 

For the smaller bottom container, I inserted a new positioned container sized at 375 pixels wide by 100 pixels high.  For the horizontal layout position I selected to center it.  For the vertical position layout I set it at 100 pixels from the top.

 

The last step is to reset the Message Area margins to accommodate the two additional containers.  For this example, I increased the top margin to 250 pixels and the bottom margin to 170 pixels.

 

 

Return to Postitioned Container Example Page

 

   elmac_cms dezign copyright 2000