ナビバーの位置を変更する

2カラムのテンプレートで、記事部分とサイドバーの左右の配置を入れ替えるカスタマイズ。

floatとmarginを使っているタイプ

例) 針ねずみのノート#003

#main {
float:left; → float: right;
border-left:1px solid #999;
border-bottom:1px solid #999;
border-right:1px solid #999;
width:480px;
background:#fff;
}

#navi { 
margin: 0 0 0 490px; → margin: 0 490px 0 0;
}

両方にfloatをかけているタイプ

例) bon voyage! 2カラム

#main {
float: left; → float: right;
width: 550px;
}

#navi {
float: right; → float: left;
width: 220px;
padding:10px 10px 10px 0;
}

これで記事とナビバーの位置が入れ替わります。
基本的にはfloatやマージンの方向をそれぞれ左右逆にするだけです。 デザインによってはアイコンやボーダーの位置なども左右逆にしてあげないといけないものもあります。テンプレートに合わせて他の部分も調整してあげて下さい。

Related Archive