記事参照

No.0 2011/01/17 07:09
題:CSS
名:CSS
ID:I7uTQJBn2sP1

@charset "Shift_JIS";
/* ========BASIC======== */
html{
margin:0;
text-align:center;
padding:10px;
background:url(image/2bg-toku-tukikukan-white-ao.jpg) no-repeat right fixed ;
}
body{
font-size : 0.8em;
font-family : Verdana,Osaka,'MS UI Gothic';
color:#333;
line-height:150%;
margin:0;
letter-spacing:0.05em;
background:url(image/10xmas-w03.jpg) 110% 125% no-repeat fixed;
}
a{
color:#899501;
text-decoration:none;
}
a:hover{
color:#ffffff;
cursor:e-resize;
}
image{
border:0;
}
br{
letter-spacing:normal;
}
/* タイトル */
h1{
font-size:16px;
color:#339999;
font-weight:bold;
text-align:center;
margin:30px;
}
/* ========TEMPLATE FRAMEWORK======== */
div#wrapper{
background:url(image/bg-toku-tukikukan-white-ao.jpg) no-repeat fixed ;
margin:0;
text-align:center;
padding:10px;
}
/* ========MENU CUSTOMIZE======== */
div#menu{
}
div#menu ul{
list-style:none;
padding-left:90px;
margin:30px 0;
}
div#menu li{
display:inline;
padding-right:30px;
}
/* ========CONTENTS CUSTOMIZE======== */
div#contents{
}
div#contents h2{
background:url(image/judges-crest-silver.gif) no-repeat;
padding:3px 3px 3px 45px;
border-bottom:1px #899501 dotted;
font-size:1em;
font-weight:normal;
line-height:29px;
margin:0;
}
div#contents p{
margin:0;
padding:0.5em 0 2em 0;
}
div#contents strong{
color:red;
font-weight:normal;
border-bottom:1px dashed #999;
}
/* ========FOOTER CUSTOMIZE======== */
div#footer{
font-size:0.9em;
text-align:center;
padding:10px;
border-top:5px double #899501;
}


次の二つ
html{
margin:0;
text-align:center;
padding:10px;
background:url(image/2bg-toku-tukikukan-white-ao.jpg) no-repeat right fixed ;
}

/* ========TEMPLATE FRAMEWORK======== */
div#wrapper{
background:url(image/bg-toku-tukikukan-white-ao.jpg) no-repeat fixed ;
margin:0;
text-align:center;
padding:10px;
の部分に注目してください
今背景の左右に画像ひとつずつ使おうとしています
cssでbodyとhtmlを使うと解決するとのことで早速ためしてみたものの
確かに成功したのですが、左の画像にブレ(ページ全体と画像に白い隙間が出来る)がおきて、右は無事です。
右の画像(htmlの部分すべて)を外すと左のブレはなくなります
この問題の解決方法をご存知ありませんか?
あとこの二つの画像は左右対称です
その二つの高さ(横幅は大丈夫です)をきっちりそろえる方法はなんでしょうか?
どうか、お教えください
当方初心者で、内容に関係のない余計な改行等があるかもしれませんが、どうかお許しください



掲示板に戻る