ピエールの日記 by pierre 長尾和美

ピエールです。SamuraiTraditional(サムトラ)、たけしを(逸見泰典とのユニット)でギターやってます♪思いつきをブログに! ^^v by pierre

Stinger3 カスタマイズ - ブログ(サイト)の横幅のサイズを変更

      2017/10/25

自分がカスタマイズしたものを忘れないようにメモ。

ブログの横幅のサイズを変更します。

Stingerの場合は横幅サイズが小さく、ページが狭い。
という記事を良く見かけるのですが、
自分ではあまりそのようには感じていなかったので、
変更する予定はまったくなかったのですが。。。

とある日、他のPCで自分のブログを見る機会があったので、
ちょっと見てみたところ、レイアウトがなんか自分のPCで見ているのと全然違うwww
正直何もかもが小さいなぁ。。という印象。
そんなわけで、他の方ブログで書いているような横幅が狭い。
というのを実感したので修正することにしました。

サイズに関してはどのくらいにすれば良いのかは検討もつかず、
他のブログでみかけたものをマネしてサイズを決めました。

修正自体はやっぱりstyle.cssを修正する。
という感じでしたので、下記メモを投稿しました。

style.cssの下記部分を修正。

●メイン記事の横幅の変更


#wrap #wrap-in #main {
	float: left;
	width: 550px;
	padding-right: 39px;
	padding-left: 39px;
	padding-top: 20px;
	border: 1px solid #ccc;
	background-color: #FFF;
	border-radius: 4px 4px 4px 4px;
	padding-bottom: 20px;
}

自分はwidth: 550px;を670pxとしました。

●コンテンツ全体の横幅の変更


#header-in, #wrap-in, #navi-in, #footer-in, #gazou-in {
	width: 986px;
	margin-right: auto;
	margin-left: auto;
}

自分はwidth: 980px;を1110pxとしました。

この設定で自分の小さなノートPCで見ると、
横に関してもスクロールバーがあったりしてちょっと見づらい。。
という印象があるにしても、
大きなPCで見るとこれがジャストサイズなのかなぁ。
という感じにも捉えられるので、
とりあえずこのサイズにしておきましたが、
またリサイズすることもあるかもしれないですwww

 - Stinger3, Web, wordpress