.jpg)
#outer-wrapper {
width: 1000px;
margin:0 auto;
background:white;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 50%;
background:white;
padding-left:10px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;
text-align:left; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
background:white;
border:1px solid #cccccc;
width:25%;
float: left;
padding-left:0px;
margin-left:0px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
vertical-align:top;
text-align:left;
}
#sidebar2-wrapper {
background:white;
border:1px solid #cccccc;
width:20%;
float: right; // improtant
padding-left:0px;
margin-left:0px;
vertical-align:top;
text-align:left; /* fix for long non-text content breaking IE sidebar float */
}
---------------------------
then sort code become
-------------------------
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>
------left
</div>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>
--------------left
<div id='sidebar2-wrapper'>
<b:section class='sidebar' id='sidebar2' preferred='yes'>
<b:widget id='Label1' locked='false' title='TAB' type='Label'/>
</b:section>
-right
</div>
<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>
No comments: