アメブロの記事幅を広げ、記事の枠を消す



内藤です。

2011年8月以降新しくなったカスタム可能デザイン【CSS編集用デザイン】では、記事エリアが470pxになりましたが、枠や余白を除いた記事本文の幅は410pxとなっています。

広くなったように見えて、狭くなっています



カスタム可能デザインってなに? 【CSS編集用デザイン】ってなに? という方はこちら

記事エリアについている各記事の枠と、文との余白を狭くして記事幅を広げるやり方は以前ご紹介しました。

【CSS編集用デザイン】で  [CSSの編集]で

/* skinArticleBody 記事本文エリア */
.skinArticleBody{}
.skinArticleBody2{
margin:0 29px;
}

という個所のmargin:0 29px;の数値が左右の余白になりますので、数値を小さくすると記事自体の幅は広がります。

記事本文に合わせて、記事タイトルの幅も変更するならば

/* skinArticleHeader 記事タイトルエリア */
.skinArticleHeader{
margin:0 29px;
padding:2px 10px;
border-left:5px solid #e4e4e4;
}

のmargin:0 29px;の数値を変更します。

また、記事幅が広がったことで、枠との余白が狭くなり圧迫感を感じるならば

/* skinArticle 記事エリア */
.skinArticle{
/* 注 ベースのcssに margin-bottom の記述有り */
padding:16px 0;
border:1px solid #dddddd;
background:#ffffff;/* ←記事に背景を敷きたいとき */
}

のborder:1px solid #dddddd; を border:0px solid #dddddd; にすると枠がなくなります。

やってみてくださいね

その他の自分でできるカスタマイズはこちら

2017年3月からのアメブロ常時SSL化に際しまして、「フリープラグイン」を使ったカスタマイズが利用できなくなる可能性があります
【追記あり】アメーバブログの常時SSL化に伴う仕様変更について|スタッフブログ
フリープラグインを使ったカスタマイズはせずに、CSSを使ったカスタマイズを行ってください