戻る

Recommended menuのマージンとパディングを調整する

CSS

ファイル名：hollywood_cafe/4t/style.css

@charset "utf-8";

/* 基本設定　ここから */

body{
	color:#555555;
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック", "MS P Gothic",sans-serif;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
	background-color:#999999;
}

a:link{
	color:#55555;
	text-decoration:none;
}
 
a:visited{
	color:#888888;
	text-decoration:none;
}
 
a:hover{
	color:#FF6600;
	text-decoration:none;
}
 
a:active{
	color:#000000;
	text-decoration:none;
}

h1,h2,h3{
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
}

img{
	border:0;
}

hr{
	display:none;
}

h1{
	position:absolute;
	top:-20px;
	left:40px;
}

h2{
	width:700px;
	height:300px;
	background-image:url(images/top/main_image.jpg);
	text-indent:-9999px;
}

/* 基本設定　ここまで */

/* レイアウト設定　ここから */

div#pageBody{
	width:760px;
	margin-top:20px;
	margin-right:auto;
	margin-left:auto;
	background-color:#FFFFFF;
	background-image:url(images/top/body_bg.jpg);
	background-repeat:repeat-y;
	position:relative;
}

#pageTop{
	background-image:url(images/top/body_bg_t.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	padding-top:70px;
	padding-right:30px;
	padding-bottom:0px;
	padding-left:30px;
}

#contents{
	width:440px;
	padding-right:19px;
	float:left;
	border-right-width:1px;
	border-right-style:dotted;
	border-right-color:#999999;
}

#side{
	width:220px;
	padding-left:20px;
	float:right;
}

#contentsWrap{
	clear:both;
}

/* レイアウト設定　ここまで */

/* PageTopへのリンクテキスト　ここから */

#gotoTop{
	clear:both;
}

/* PageTopへのリンクテキスト　ここまで */

/* SITEMAPへのリンクテキスト　ここから */
 
#siteMap{
	font-size:0.7em;
	text-transform:uppercase;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
	position:absolute;
	top:35px;
	right:35px;
}

#siteMap a{
	background-image:url(images/top/icon_arrow_02.gif);
	background-repeat:no-repeat;
	background-position:left;
	padding-left:13px;
}

/* SITEMAPへのリンクテキスト　ここから */

/* ナビゲーション　ここから */

#globalNavi{
	list-style-type:none;
	width:660px;
	height:30px;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:20px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:20px;
	background-image:url(images/top/navi_bg.gif);
	background-repeat:no-repeat;
	background-position:top left;
	position:absolute;
	top:320px;
	left:40px;
}

#globalNavi li{
	margin-top:0px;
	margin-right:10px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
	float:left;
}

/* ナビゲーション　ここまで */

/* TOP　ここから */

p#welcomeMessage{
	color:#999999;
	font-size:0.8em;
	line-height:1.5em;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
	background-color:#FFFFFF;
}

p#welcomeMessage img{
	float:right;
	margin-left:25px;
}

#topRecommendedMenu{
	clear:both;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
}

#topRecommendedMenu dt,
#topRecommendedMenu dd{
	background-color:#EEEEEE;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
}

#topRecommendedMenu ul{
	font-size:0.8em;
	line-height:1.5em;
	list-style-type:none;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
}

#topRecommendedMenu ul li dl{
	width:240px;
	float:right;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
}

#topRecommendedMenu dd ul img{
	float:left;
}

#topRecommendedMenu ul li{
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-left:0px;
	clear:both;
}

/* TOP　ここまで */

ブロックレベル要素が上下に隣接する場合、上のボックスの下マージンと、下のボックスの上マージンは両方がプラスされるのではなく、大きい側のマージンだけが有効になります。

Copyright © 2012 YOHSUKE NAKANO