※ ChatGPTを利用し、要約された質問です(原文:CSSでポップアップしたけど変な場所でポップ?)
CSSでポップアップしたけど変な場所でポップ?
このQ&Aのポイント
不動産サイトの沿線の地図から駅名の上でボタンでポップアップするようにコーディングしたが、本来駅名の上だけでポップアップするはずなのに変な場所でもポップアップしてしまう。
地図の右上らへんにポップアップしてしまうバグが発生している。
CSSのスタイルシートに問題があるのかもしれない。
CSSに詳しい方!!
どうかお助けください!
不動産サイトの沿線の地図から駅名の上でボタンでポップアップするようにコーディングしました。
・・・が本来駅名の上だけでポップアップするはずなので変な場所でもポップアップしてしまいます・・・!
地図の右上らへん・・・
(駅名の上にテキストで駅名が出てるのはバグではなく故意です。)
誰かアドバイスいただけないでしょうか・・?!
どうぞよろしくお願いします。
ちなみにスタイルシートは以下のコードです。
■■css■■■■■■■■■■■■■■■■■■■■■■■■■■■
/* navi-start 共通
----------------------------------- */
#navi00 {
width:570px;
height:400px;
background:url(../img/rosen04.jpg);
position:relative;
}
/* いったんコメントアウト
---------------------
#navi00 strong {
text-indent:-9999px;
visibility:hidden;
font-size:0.1em;
line-height:0;
}
/*----ナビ・ボタンごとの設定----*/
/* 01 本町-------------------------------------------------*/
#navi00 ul li.n_01 span {
position:absolute;
top:190px;
left:204px;
display:block;
height:31px;
width:101px;
}
#navi00 ul li.n_01_on span {
position:absolute;
top:190px;
left:204px;
display:block;
height:31px;
width:101px;
}
#navi00 li.n_01_on ul.sub {
position:absolute;
width:120px;
top:165px;
left:140px;
z-index:10;
background:none;
}
#navi00 li.n_01 ul.sub {
display:none;
}
///* 座標違いで02~06まで続きます。
/*----プルダウンの設定----*/
#navi00 ul li ul.sub li a {
background:url(../img/bu_pop.jpg) no-repeat;
filter:alpha(opacity=90);
height:30px;
padding:10px 0 0 10px;
width:110px;
display:block;
z-index:10;
color:#333;
text-align:left;
text-indent:1em;
font-size:14px;
font-weight:bold;
font-family:"ヒラギノ角ゴ Pro W3" , "MS Pゴシック", Osaka;
} head + body #navi00 ul li ul.sub li a {
height:30px;
}
#navi00 ul li ul.sub li a:hover {
background:url(../img/bu_pop_r.jpg) no-repeat;
}