当ブログについて | 管理人プロフィール | コンタクト

[1日更新]マックでスタイルシート修正

2007.01.30 日記・コラム・つぶやき C(2) TB(0) このエントリーを含む「はてなブックマーク」 この記事を「livedoorクリップ」! 「Yahoo!ブックマーク」に登録

写真滅多にないアポが今日は3件。
午前中に2件済ませ、午後2時に大塚でもう一件。1時間だけ余裕ができたので、このすきに、昨夜作って公開したスタイルシートを修正しようと思う。

ちなみに、「マックで修正」は、MacBookではなく、マクドナルド大塚店。
食べているのは、メタボリックメガマックではなく、普通のチーズバーガーだ。

まずは、前の記事にコメントで崩れを教えてくれたlonestarさん、うかさんに感謝!
外出先でコメントで読んで、

「そういや、FirefoxでもMacBookのサファリでも確認してなかった」

と深く反省。
いくら深夜・飲み会帰りとはいえ、公開前の複数ブラウザチェックはサイト運営者の義務。ちゃんと習慣付けたいもんだ。

このままだとFirefoxで見たときに(多分Macも)センタリングされないので、#containerに「margin:0 auto;」と追記することをオススメします^^

投稿者: うか (2007/01/30 8:30:33)

うかさんには、スタイルシートの記述こうすればいいというアドバイスまでいただいた。感謝!

まずはMozillaチェック。

写真
 
 
恥っ!
 
 
ひっ、ひどい・・・ひどすぎる・・・。
いくら即席で書いているっていっても、なんかセンタリング以外も問題ありまくりだ。

すぐ直さなきゃ。
とりあえず、この記事一回アップしてから修正作業に入ろうと思う。


+++


そして第一次修正完了。
うかさんアドバイスの「#containerに「margin:0 auto;」と追記」をまずはやってみた。
FTP含めて作業時間1分もかからない。

▼修正前


#container {
       width: 800px;
       text-align: left;
       font-size: 12px;
       line-height: 120%;
       padding: 0px 15px 10px 15px;
}


▼修正後


#container {
       width: 800px;
       text-align: left;
       font-size: 12px;
       line-height: 120%;
       padding: 0px 15px 10px 15px;
       margin:0px auto;
}

こうなった。

写真

無事センタリングした!
うかさんありがとう!

でもまだ問題は山積みだ。

まず箇条書き部分のインデント。
これもうかさんが前のコメントでアドバイスしてくれていたように、「余白とマージン指定」の問題だろう。

フッター部分でまわりこみが解除されていない。これは、前に別のサイトでなにかやったらうまくいったんだよな。探してみよう。


せっかくなんで、直していった過程がわかるよう、
ミスありソースも残しておきます。

作成過程その1:スタイルシートを当てる前のすっぴん顔サイト
作成過程その2:スタイルシートにミスがあるもの(style02.css)
作成過程その3:センタリングするよう修正を加えたもの



コメント

記事に名前まで書いていただきありがとうございます!CSSは簡単にデザインできて好きなんですが、一度パニックになると、、、もうどうにも出来ないくらいグチャグチャになる事もあるので、好きなんだけど、嫌いになったりします。

投稿者: lonestar (2007.01.30 16:01)

lonestarさん、
こちらこそありがとうございます。
外出先で携帯でコメント読んで、慌てて修正しました。
CSS、好きなんだけど嫌いになったり・・・の気持ち、よくわかります!

投稿者: わだ (2007.01.31 00:20)





トラックバック
http://app.cocolog-nifty.com/t/trackback/5901/13715767

内容に関連性のある記事からのトラックバックは歓迎です。記事内リンクも特に必要ありません。過去交流のないブログでもまったく問題ありません。ただし「単に部分的なキーワードつながり(関連性が薄すぎ)」「自動で大量トラックバック送信」「自身がトラックバックを受付けていないブログからの一方的なトラックバック」は、削除します。

最新の記事

管理人プロフィール

和田 亜希子

利根川流域に生息するアラフォー独女。ニッチなテーマで小さなサイトを作る「ミニサイト職人」で、主に運営サイトの広告収入で生計たてるようになり早10年経ちました。「パソコン一台携え、旅しながらサイト運営で生計立てる」ベドウィン・モバイラーの夢まであと一歩。大切にしたいのは「好奇心」と「向上心」。うさぎは2011年の干支、ヘビ年バージョンはこちらです。(詳細

Twitter

著書一覧(Amazon)
Yahoo!プロフィール
YouTube動画一覧

AMNパートナーブログ