CSS編集に挑戦してみた。

     初心者でわからない事だらけですが、『CSS編集』に挑戦してみました。
     何ごともチャレンジ~!
     
     ◆やってみたかったこと
          ・テンプレートの横幅を広げたい…ウェブリブログのテンプレートって、狭いですよね。
          ・サイドバーの幅も広げたい…もうちょっとゆとりがあってもいいかな、と思って。

     
     さあ、ここからが茨の道、悪戦苦闘の始まりでした。いろいろ調べた結果、とてもわかりやすくて
     ありがたいページにたどり着きました。

           オクターブの共鳴音さんのブログ記事・・・・・
         
               「 横幅の広げ方:サイドバー表示にすると狭いと感じる方へ 」



     ★ 全体の横幅
         オクターブの共鳴音さんが820pxに設定してらっしゃるのを参考にして
         思い切って1000pxにしました。

     ★ サイドバーの横幅
         オクターブの共鳴音さんの記事に寄せられたトラックバックの記事を拝見すると、ありました!

                MOBI。さんのブログ記事・・・・・カスタマイズに挑戦(1)  

         本来は160pxらしいのですが、MOBI。さんの記事をまるごと参考にさせていただき
         260pxにしました。

     ★ 記事ページの横幅 
         ここが1番苦労しました。いまだにからくりがよくわかんないんですが・・・。
         オクターブの共鳴音さんの記事によると

              『全体の横幅-サイドバーの幅-記事の幅=60px(マージン分)』
         
         となってます。ということはつまり、私のブログにあてはめて考えると

        『1000px(全体幅)-260px(サイドバー)-60(マージン)=680px(記事幅)』
         
         ということになります。な~んだ、思ったよか簡単じゃ~ん!と油断した私がアホだった。
         確認のため自分のブログを見てみたら、なんと記事とサイドバーの間に
         ヘンな溝が(亀裂みたいの)出来てるじゃありませんか。(なんででしょー?)
         これを埋めるために680pxからちょっとずつ数値を増やし、結局720pxでようやく溝が
         なくなりました。でもこうなると、オクターブの共鳴音さんが書かれた数式に、
         あてはまらなくなり…
         「?」 の連続ですが、ま、とりあえずはこれでいこうと思います。(←アバウトだし・笑)
         しかもMOBI。さんの記事によると、テンプレートによっては、デザインが崩れることもあるとか。
         もしそうなったらなったで、その時になったらまた悩むことにします。

     ★ あとはオクターブの共鳴音さんの記事に従って、コメント欄の幅も広げてみました。



     なんだかんだいって、時間はかかったけど私にもできました!
     CSS編集の画面をはじめて見た時は、同じ星の言葉とは思えませんでした。
     しかも 「:」 と 「;」 をまちがえただけでも反映されないし(あたりまえか。笑。)、
     書き込む行を間違えてもダメだしNGの連発だったけど、何度もやり直すうちに少しずつ
     わかってきて楽しく作業を進めることができました。


     オクターブの共鳴音さん、MOBI。さん、ありがとうございました!
     とてもとても、参考になりました。





[追記・2009-02-28]

     再度少し変更しました。


        ・全体幅   920px
     
        ・記事幅   640px

        ・サイドバーは変わらず260px

        
     

     

     

     

                             
                           
         

                           

"CSS編集に挑戦してみた。"へのコメントを書く

お名前:[必須入力]
メールアドレス:
ホームページアドレス:
コメント:[必須入力]