CSSを使って幅100%で3カラムを表示

| コメント(0) | トラックバック(0)

いまさらかもしれないですが、昨日に引き続きXOOPSを見ていたら、まだテーブルを使ったレイアウト表示だったので、メインレイアウトだけでもCSSに変更しようということでやったこと

今は、パソコン画面が横に広くなってきているので、幅を100%使うために

#container {width:100%; clear:both;}

そしてその中に3カラムで、メニュー固定幅170pxを一番右側、次に広告などに使うカラムこれも170px
そしてメインのカラムを左側に残った部分を使うようにする

#menucolumn {width:170px; float:right} 一番右

#cmcolumn {width:170px; float:right;} 次に右

#maincolumn {margin-right:350px; width:auto; padding:5px 10px;} メインの内容

これで、メインのカラムが可変で全体の幅を使ったページのレイアウトができる
この4つの内容だけで、カラムの位置や幅が簡単に変えられるので、テーマの利用時や後からレイアウト変更にも簡単に対応できるはず


ブログランキング・にほんブログ村へ 人気ブログランキングへ
ランキングに参加しています。 応援をお願いします。

トラックバック(0)

トラックバックURL: http://www.sohosharing.com/mt/mt-tb.cgi/311

コメントする

結婚・結婚式・ウェディングに役立つガイド

婚約したカップルは必見!当サイトは結婚に関するお役立ち情報サイトです。結婚、結婚式、ウェディングの事前準備はもちろん、マナーや、楽しい挙式の事例などを紹介しています。

MTBlog50c3BetaInner

このブログ記事について

このページは、sohosが2009年4月21日 22:49に書いたブログ記事です。

ひとつ前のブログ記事は「XOOPS 2.0.16a JP を XOOPS JPEx にアップデート」です。

次のブログ記事は「前山寺の花」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。



マイクロアドBTパートナーでおこづかいゲット!

Blog Rank

置き手紙

おきてがみで訪問の
履歴を残してください

訪問ありがとうございます!

アーカイブ

Soho's Site