Put this code under "body" in the section where you want to place the container:
<b:section class='type-of-widget-here-main-sidebar-etc' id='custom-id-for-styling' preferred='yes'/>
Then above the location "/ b: skin":
#custom-id-for-styling { width: 100%; margin-left: auto; margin-right: auto; padding:0px; }
Place 2 containers next to each other:
<b:section class='new-sidebar' id='magazine-left' showaddelement='yes'/> <b:section class='new-sidebar' id='magazine-right' showaddelement='yes'/> <div style='clear: both;'/>
CSS
#magazine-left { width: 45%; float: left; } #magazine-right { width: 45%; float: right; }
Place 3 containers next to each other:
<b:section class='main' id='container-left' showaddelement='yes'/> <b:section class='main' id='container-middle' showaddelement='yes'/> <b:section class='main' id='container-right' showaddelement='yes'/> <div style='clear: both;'/>
CSS
#container-left { width: 31.3%; float: left; margin-left: auto; margin-right: auto; padding:0px; } #container-middle { width: 31.3%; float: left; margin-left: auto; margin-right: auto; padding:0px; left:0px; right:0px; } #container-right { width: 31.3%; float: right; margin-left: auto; margin-right: auto; padding:0px; }
source share