返信先: メニューの文言位置について
こんにちは
お使いのテーマ内のstyle.cssを以下のように修正する必要があります。
◆ style.css 179行目あたり
div.mainnavi ul li,
ul.mainnavi li {
padding: 0px;
margin: 0px;
float: left;
position: relative;
}
を
div.mainnavi ul li,
ul.mainnavi li {
padding: 0px;
margin: 0px;
position: relative;
display: table-cell;
vertical-align: middle;
background-image: url('images/button_main_navi.jpg');
background-repeat: no-repeat;
background-position: -131px 0px;
}
◆ style.css 186行目あたり
div.mainnavi li a,
ul.mainnavi li a {
width: 121px;
height: 36px;
padding: 20px 5px 0px 5px;
margin: 0px;
display: block;
background-image: url('images/button_main_navi.jpg');
background-repeat: no-repeat;
background-position: -131px 0px;
color: #FFF;
font-weight: bold;
font-size: 13px;
text-align: center;
}
を
div.mainnavi li a,
ul.mainnavi li a {
width: 121px;
padding: 5px;
margin: 0px;
display: block;
color: #FFF;
font-weight: bold;
font-size: 13px;
text-align: center;
}
◆ style.css 202行目あたり
div.mainnavi li a:hover,
ul.mainnavi li a:hover {
background-position: 0px 0px;
text-decoration: none;
}
を
div.mainnavi li a:hover,
ul.mainnavi li a:hover {
text-decoration: none;
}
◆ style.css 206行目あたり
div.mainnavi ul ul,
ul.mainnavi ul {
display:none;
position:absolute;
top:56px;
left:0;
float:left;
box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
z-index: 99999;
}
を
div.mainnavi ul ul,
ul.mainnavi ul {
display:none;
position:absolute;
top:100%;
left:0;
float:left;
box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
z-index: 99999;
}
◆ style.css 219行目あたり
div.mainnavi ul ul li,
ul.mainnavi ul li {
min-width: 111px;
}
を
div.mainnavi ul ul li,
ul.mainnavi ul li {
display: block;
min-width: 111px;
}
に修正してください。
また、以下のスタイルを追記してください。
div.mainnavi li:hover,
ul.mainnavi li:hover {
background-position: 0px 0px;
}
以上になります。
どうぞよろしくお願いします。
PAGE TOP