• 文字サイズ


質問中

ヘッダーの空白について

  • 相談者:非公開
  • 2024/11/25 12:34
お世話になります。

PCのヘッダーが空白部分が出てしまいます。

タグが間違っているのでしょうか?

よろしくお願いします。

<!--▼ガイドリスト-->
<style type="text/css">
<!--
#ogaria_header_list_guide{
font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"MS Pゴシック",sans-serif;
width:100%;
margin:0 auto;
}
#ogaria_header_list_guide ul{
overflow:hidden;
list-style-type:none;
margin:0;
padding:0;

}
#ogaria_header_list_guide ul li{
float:right;
margin:0 0 0 20px;
}

#ogaria_header_list_guide ul li a{
position: relative;
display: block;
text-decoration:none;
font-size:12px;
color:#555;
text-indent:13px;
}
#ogaria_header_list_guide ul li a:before {
display: block;
content: "";
position: absolute;
top: 47%;
left: 4px;
width: 0;
height: 0;
margin-top: -5px;
border: 5px solid transparent;
border-left: 5px solid #555;
}
#ogaria_header_list_guide ul li a:after {
display: block;
content: "";
position: absolute;
top: 47%;
width: 6px;
height: 4px;
margin-top: -2px;
background: #555;
}
#ogaria_header_list_guide ul li a:hover{
text-decoration:underline;
}

-->
</style>

<div id="ogaria_header_list_guide">
<ul>
<li><a href="https://www.rakuten.co.jp/SHOP-URL/news.html" target="_top">メルマガ登録</a></li>
<li><a href="https://basket.step.rakuten.co.jp/rms/mall/bs/cartall/" target="_top">買い物かご</a></li>
<li><a href="https://www.rakuten.co.jp/SHOP-URL/info2.html" target="_top">お支払い・送料</a></li>
<li><a href="https://www.rakuten.co.jp/SHOP-URL/info.html" target="_top">会社概要</a></li>
<li><a href="https://www.rakuten.co.jp/SHOP-URL/" target="_top">トップページ</a></li>
</ul>
</div>
<!--▲ガイドリスト--><Center>


<!--▼ヘッダーバナー-->
<iframe src="https//www.rakuten.ne.jp/gold/SHOP-URL/ogaria/show_item/index.html?id=35&version=1544615564528" width="998px" height="200px" scrolling="no" frameborder="0" marginheight="0" marginwidth="0"></iframe>
<!--▲ヘッダーバナー-->


<!-- CSS -->
<style type="text/css">
<!--
img.margin {
margin: 5px 10px;
}

/* ------ base ------------------------------------------------------ */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}

/* IE6 */
* html .clearfix {
zoom: 1;
}

/* IE7 */
:first-child+html .clearfix {
zoom: 1;
}

.grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11 {
float: left;
display: inline;
margin-left: 20px;
}

/* ------ grid ------------------------------------------------------ */
.grid1 {
width: 60px;
}

.grid2 {
width: 140px;
}

.grid3 {
width: 220px;
}

.grid4 {
width: 300px;
}

.grid5 {
width: 380px;
}

.grid6 {
width: 460px;
}

.grid7 {
width: 540px;
}

.grid8 {
width: 620px;
}

.grid9 {
width: 700px;
}

.grid10 {
width: 780px;
}

.grid11 {
width: 860px;
}

.grid12 {
width: 940px;
}

.first {
margin-left: 0;
clear: both;
}

.grid,.grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11 {
margin-bottom: 15px;
padding-top: 5px;
padding-bottom: 5px;
border-width: 1px 0;
}

/* ------ layout ------------------------------------------------------ */
.w220 {
width: 220px;
}

.w440 {
width: 460px;
}

.w700 {
width: 700px;
}

.w940 {
width: 940px;
}

/* ------ typography------------------------------------------------------ */
em {
font-weight: 700;
color: #c00;
}

.lead {
font-size: 130%;
margin-bottom: 1em;
font-weight: 700;
}

.big {
font-size: 130%;
}

.small {
font-size: 70%;
}

/* ------ design------------------------------------------------------ */
a {
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

a:hover img {
opacity: .8;
filter: alpha(opacity=80);
}

img {
margin-bottom: 5px;
}

.box {
border: 1px #999 solid;
margin: 5px !important;
padding: 5px;
clear: both;
}

.center {
text-align: center;
}

/* ------ header ------------------------------------------------------ */
div.header {
font-size: 13px;
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;
clear: both;
}

div.header .grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11 {
margin-top: 5px;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
border-width: 1px 0;
}

/* ------ content ------------------------------------------------------ */
div.content {
padding-top: .5em;
font-size: 16px;
line-height: 130%;
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;
clear: both;
}

div.content h1 {
font-size: 32px;
font-weight: 700;
color: #900;
line-height: 130%;
clear: both;
}

div.content h2 {
border-bottom: 1px dotted #ccc;
padding: 0 0 5px 5px;
margin-top: 1.5em;
margin-bottom: .5em;
line-height: 130%;
clear: both;
}

div.content h3 {
color: #0090ff;
font-size: 15px;
border-left-color: #00bfff;
border-bottom-color: #00bfff;
padding: 3px 0 0 6px;
margin-top: 1.5em;
border-style: solid;
border-width: 0 0 2px 9px;
line-height: 130%;
clear: both;
}

/* ------ sidebar ------------------------------------------------------ */
div.sidebar {
font-size: 13px;
padding-top: 1em;
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;
clear: both;
}

div.sidebar h2 {
padding: 5px 10px;
margin-bottom: 1em;
margin-top: 1em;
margin-bottom: .5em;
background-color: #fffacc;
font-size: 17px;
border-bottom: 1px #aaa solid;
border-top: 1px #666 solid;
clear: both;
}

div.sidebar h3 {
padding-left: 1em;
border-bottom: #ffdf00 2px solid;
font-size: 15px;
clear: both;
margin-bottom: 5px;
}

div.sidebar h3.img {
padding-left: 0;
margin-bottom: -10px;
border-bottom: none;
clear: both;
}

div.sidebar li {
list-style-type: none;
font-size: 12px;
line-height: 110%;
list-style-type: none;
position: relative;
left: -1em;
}

/* ------ listMenu ------------------------------------------------------ */
/* keywords */
div.keywords ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
display: block;
margin: 10px 0 8px;
font-size: 14px;
text-align: center;
text-transform: uppercase;
}

div.keywords ul li {
float: left;
margin-right: 3px;
font-size: 95%;
}

div.keywords ul a:link,div.keywords ul a:visited {
text-decoration: none;
padding: 5px 9px 3px;
}

div.keywords ul a:hover {
text-decoration: underline;
}

.guide {
background-color: #FF4500;
color: #fff;
font-weight: 700;
margin-top: 0;
padding: 0 7px;
}

/* gradation */
.topline-yellow {
border-top: #ffdf00 2px solid;
}

.topline-red {
border-top: #c00 2px solid;
}

.topline-gray {
border-top: #aaa 2px solid;
}

div.navibar2 {
width: 940px;
overflow: hidden;
height: 32px;
font-weight: 700;
font-size: 110%;
border-bottom: #aaa 1px solid;
background: #FFF;
/* old browsers */
background: -moz-linear-gradient(top,#FFF 28%,#F4F4F4 75%,#DBDBDB 100%);
/* firefox */
background: -webkit-gradient(linear,left top,left bottom,color-stop(28%,#FFF),color-stop(75%,#F4F4F4),color-stop(100%,#DBDBDB));
/* webkit */
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#FFF',endColorstr='#efefef',GradientType=0);
/* ie */
}


/* navibar2 */

div.navibar2 UL {
padding: 0;
margin: 0;
width: auto;
list-style-type: none;
}

div.navibar2 UL LI {
display: block;
float: left;
height: 32px;
padding-top: .5em;
text-decoration: none;
border-right: 1px solid #dfdfdf;
}

div.navibar2 ul li A {
color: #000;
text-decoration: none;
height: 32px;
padding-right: 1em;
padding-left: 1em;
}

div.navibar2 ul li A:hover {
color: #C00;
height: 32px;
padding-right: 1em;
padding-left: 1em;
}


/* simple */

div.navibar ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}

div.navibar ul li {
float: left;
margin-right: 3px;
}

div.navibar ul a:link,div.navibar ul a:visited {
display: block;
font-size: 16px;
font-weight: 700;
color: #FFF;
background-color: #98bf21;
text-align: center;
padding: 3px 9px;
text-decoration: none;
text-transform: uppercase;
}

div.navibar ul a:hover {
background-color: #7A991A;
}


/* navibar-center */

div.navibar-center ul {
margin: 0;
padding: 0;
text-align: center;
  list-style: none;
}

div.navibar-center ul li {
list-style-type: none;
display: inline-block;
margin-right: 3px;
list-style: none;
 display: inline;
zoom: 1;
}

div.navibar-center ul a:link,div.navibar ul a:visited {
font-size: 16px;
font-weight: 700;
color: #FFF;
background-color: #98bf21;
text-align: center;
padding: 3px 9px;
text-decoration: none;
text-transform: uppercase;
}

div.navibar-center ul a:hover {
background-color: #7A991A;
}
-->
</style>


<!--▼シンプルで見やすい商品リスト-->
<style type="text/css">
<!--
#risFil td{
font-family:ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;
}
#risFil td br{
display:none;
}
#risFil td img{
margin:30px 0 15px;
}
#risFil .category_itemnamelink{
height:30px;
color:#444;
font-size:10px;
letter-spacing:1px;
overflow:hidden;
display:block;
margin:0 0 10px;
}
#risFil .category_itemprice{
font-weight:bold;
color:#BF0000;
font-size:22px;
letter-spacing: -2px;
font-style: oblique;
}
#risFil .category_itemtaxpostage{
font-size:9px;
letter-spacing: -1px;
color:#444;
}
#risFil .category_itemtaxpostage + .category_itemtaxpostage{
display:none;
}
#risFil .not{
font-size:10px;
font-weight:normal;
display:block;
background:#FF6600;
color:#FFF;
padding:2px 0;
text-align:center;
width:100px;
margin:0 auto;
border-radius:3px;
}
#risFil .risfClfx{
font-size:10px;
}
#risFil .risfClfx img{
margin:0;
}
-->
</style>

<!--▲シンプルで見やすい商品リスト-->
<!--▼カウントダウン-->

<!--▲カウントダウン-->



<!--▼クーポン--><Center>
<iframe src="https//www.rakuten.ne.jp/gold/SHOP-URL/ogaria/show_item/index.html?id=97&version=1591833135275" width="998px" height="125px" scrolling="no" frameborder="0" marginheight="0" marginwidth="0"></iframe>
</Center><!--▼クーポン-->

<!-- 検索窓 -->
<style>.shopSearchForm{width:100%;max-width:400px;margin:0 auto;}.shopSearchForm *{vertical-align:bottom;box-sizing:border-box;height:38px;}.shopSearchInput{width:calc(100% - 45px);border:2px solid #bf0000;border-radius:3px;text-indent:8px;font-size:16px;font-family:"Meiryo", "Hiragino Kaku Gothic ProN", "MS PGothic", sans-serif;line-height:32px;}.shopSearchButton{border:none;border-radius:3px;width:48px;margin:0 0 0 -3px;cursor:pointer;background:#bf0000 url(https://image.rakuten.co.jp/SHOP-URL/img/home/itempage/haeder_sprite.png) no-repeat 1px -239px;}</style><form method="get" class="shopSearchForm" action="https://esearch.rakuten.co.jp/rms/sd/esearch/vc" accept-charset="EUC-JP" target="_top"><input type="hidden" name="sid" value="SHOP-ID"><input type="text" name="sitem" value="" size="40" placeholder="ショップ内から探す" class="shopSearchInput"><button class="shopSearchButton"></button></form>
<!-- /検索窓 -->
キーワード:ヘッダー
投稿内容について報告する
今気になってる疑問、
セミナーに参加すれば解決するかも!?
日本全国のネットショップ12,000社が参加!
ネットショップでお悩みがある方はまずはオンラインセミナーへGO!
広告0円で楽天の売上アップ続出!
ECマスターズチャンネルをチェック!
総視聴回数15万回突破!
最新の対策事例やSALE対策など、売上にお困りの方はぜひご視聴ください!

  • 返信者:非公開
  • 2024/11/25 16:26
ECマスターズの中野です。

>PCのヘッダーが空白部分が出てしまいます。
>タグが間違っているのでしょうか?

実際にひでひとさんのショップページを………(省略)………