宅配便 痛快ドタバタ活劇!

「TAKUHAI ATHLETE」が書籍で紹介されました。
やりなおしたい30歳以上のための就職読本―データとブログでシゴトがわかる!


「TAKUHAI ATHLETE」データベース
バックナンバーをまとめたページです。簡単な説明付き。


« ubicast Blogger を導入 | メイン | 3カラム(両側にサイドバー)に変更 »

2005年4月29日

サイドバーを左側に表示させたい

MovableTypeを導入すると、すぐにブログは始める事が出来ますがデフォルト(標準)の仕様では、右側にサイドバーがある”2カラム”になっています。 今回はこのサイドバーを左側に移動させてみましょう。

インデックステンプレートのスタイルシートを見てみるとサイドバーやエントリー(記事)のある部分はスタイルシートで定義されています。

#center {

float: left;
width: 500px;
overflow: hidden;
}


#right {

float: left;
width: 200px;
background-color: #FFFFFF;
overflow: hidden;
}


まず#centerというのはエントリー(記事)のある領域ですね。
ここでfloat: left;が指定されています。同様に#rightでもfloat: left;が指定されています。そのためHTMLで記述された順番により、左に回りこんでいます。ですからfloat: left;の記述をfloat: right;と書き換えればサイドバーは右側に表示されます。

#center {

float: right;
width: 500px;
overflow: hidden;
}


#right {

float: right;
width: 200px;
background-color: #FFFFFF;
overflow: hidden;
}

HTMLの記述の順番を変えるとか、他にも方法はあるかと思いますがボクは当時こうしていました。

MovableType の関連書はこちら*

*独学ですので専門的な事はわかりませんが、ボクがこのサイトで試行錯誤して行ってきたMovableTypeカスタマイズの覚え書きです。間違っている記述があるかもしれません。御了承ください*



トラックバックURL

このエントリーのトラックバックURL:
http://takuhai-athlete.com/cgi/mt/mt-tb.cgi/65


Copyright © 2004-2008 TAKUHAI ATHLETE All rights reserved.
mail to : kashiwagi7@gmail.com