メインカラム(記事部分)の横幅を広くする | JUNK BOX

JUNK BOX

文系女子によるパソコン技術向上と趣味を兼ねたブログ

みなさま、こんにちは。

 

アメブロの全体の横幅は、基本980pxに設定されていますパソコン

 

私が現在選択している「3カラム・右ワイドメニュー」のレイアウトでは、

   ・ 全体 : 980px

   ・ 左サイドバー : 180px+隙間(15px)

   ・ メインカラム(記事部分) : 470px

   ・ 右サイドバー : 300px+隙間(15px)

となっています。

 

記事部分をもっと広げたいと思い、

「新アメブロ向上企画書」様

「記事部分の横幅を広げる(ブログの横幅を広げる)」

参照:<http://ameblo.jp/newcss/entry-10987708445.html

を参考に変更しましたクラッカー

 

わかりやすくまとめてくださっていて、

無事、記事部分を広げることができましたラブラブ

 

変更後は、

   ・ 全体 : 1100px

   ・ 左サイドバー : 180px+隙間(20px)

   ・ メインカラム(記事部分) : 580px

   ・ 右サイドバー : 300px+隙間(20px)

となっています。

 

合わせてヘッダー画像記事枠画像も修正しました。


記事枠画像を470pxから580pxへ、

ヘッダー画像を1100pxにしました。

 

ただし、ヘッダー画像は、

幅980pxにデフォルトで設定されているので、

画像を差し替えただけでは、表示は980pxのままです。

 

そこで、CSS編集でコードを追加し、

 

   /* (3-2) ブログヘッダー

   --------------------------------------------*/
   /* skinHeaderArea ブログヘッダー980pxエリア */
   .skinHeaderArea{
   width:1100px;
   height:400px;

 

にして、画像の表示を1100pxにすればOKキラキラ

 
これで記事部分が以前より広々使えます音譜