iPad・iPhoneのSafariで背景が切れてしまう時のCSS

iPad・iPhoneのSafariでサイトを見たとき背景の右側がが切れてしまう時があります。

IMG_0082

こんな感じに右が切れてしまっています。

こんな時はCSSの “body”に”min-width”をたします。

body{
	border:0;
	padding:0;
	margin:0;
	font-family: "ヒラギノ角ゴ Pro W3",'Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;
	font-size:14px;
	color:#555555;
	background: #ffeeee url(images/bg.png) top center no-repeat;
	background-attachment: fixed;
	min-width:1020px;
	_display: inline;
	_zoom:1;
}

min-width:1020px;

_display: inline;

_zoom:1;

の3行を足してやるとなおります。

min-widthの大きさはサイトに合わせて調整してください。

コメントを残す