アメブロのサイドバーを左右同じ幅にするカスタマイズ


アメブロのサイドバーを左右同じ幅にするやり方です。

アメブロは、3カラムの場合、サイドバー2つある内、1つがワイド、1つが狭い幅と異なるものでした。
今回の方法は、ブログ幅を元々の980pxのまま、記事エリアも元のままで、左右のサイドバー幅を統一するやり方です。

ブログ幅980pxで記事幅を広げ、サイドバーを狭い幅で統一する方法はこちら
ブログ幅を860pxにして、サイドバーを狭い幅で統一する方法はこちら

アメブロの元々の幅  一方がワイドで、一方が狭いサイドバー


これを、記事エリア、ブログ幅をそのままで、サイドバー幅を統一します
↓↓

CSSに以下を追加します。

/*------- 3 カラム・右ワイドメニュー --------*/

.columnC .layoutContentsA{
float:right;
width:725px;
}

.columnC .skinMainArea{
float:left;
width:470px;
}
.columnC .skinSubA{
float:right;
width:240px;
}

.columnC .layoutContentsB{
float:left;
width:240px;
}

/*------- 3 カラム・左ワイドメニュー --------*/

.columnD .layoutContentsA{
float:left;
width:725px;
}
.columnD .skinMainArea{
float:right;
width:470px;
}
.columnD .skinSubA{
float:left;
width:240px;
}

.columnD .layoutContentsB{
float:right;
}
.columnD .skinSubB{
width:240px;
}
/*------- 3 カラム・右メニュー --------*/

.columnE .layoutContentsA{
overflow:visible;
}
.columnE .skinMainArea{
float:left;
width:470px;
}
.columnE .skinSubA{
float:right;
width:240px;
}

.columnE .skinSubB{
float:left;
margin-left:15px;
width:240px;
}


3カラムの全パターンに対応しています