div要素を使ってスクロールボックスのようなものを作っているのですが、その中にa:hoverを使ったリンクがあり、このリンクにマウスカーソルを持ってくると、スクロールボックス自体が下の方に移動してしまいます。
Internet Explorerでだけこの現象が発生します。FirefoxやOperaでは問題ありません。
何か解決方法はないでしょうか。
一応以下にソースを載せます。縦方向のスクロールする行が多いほど、移動する量も大きくなります。
--- css ---
div.test {
width: 90%;
height: 100px;
border: 1px solid #003333;
overflow: scroll;
}
a.test:link, a.test:visited {
color: #000000;
text-decoration: underline;
}
a.test:hover {
color: #ffffff;
background-color: #999999;
text-decoration: none;
}
--- End ---
--- html ---
<div class="test">
<table class="test" align="center">
<tr>
<th width="100px"><a class="test" href="test.html">Col1</a></th>
<th width="100px"><a class="test" href="test.html">Col2</a></th>
<th width="100px"><a class="test" href="test.html">Col3</a></th>
<tr>
<td nowrap>data1</td>
<td nowrap>data2</td>
<td nowrap>data3</td>
</tr>
以下、同じようにあと10行程度追加
</table>
</div>
No.1ベストアンサー
- 回答日時:
> <table class="test" align="center">
根本的な理由はわかりませんが、ここのalign="center"が悪さしてるようです
色々兼ね合いでバグが起きたといった感じでしょうか
html側は
<table class="test">
と変更し、tableをセンタリングをするために、
css側のdiv.test{}内に text-align:center; をIE用に追加(1)、
新たな指定要素設定として table.test {margin:0 auto;} を追加すれば解決すると思います
XHTMLなら(1)部分は必要ないです
IE以外のブラウザ用にalign="center"を入れていたのですが、
margin:autoでイケるんですね。
ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript vertical sliderをautoplayしたい 2 2022/08/25 14:47
- HTML・CSS テーブルタグのセルの幅の一部だけを指定 1 2023/03/12 12:02
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS cssが効かなくて困ってます 1 2023/01/01 23:57
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
html でのテキスト結合について
-
tableタグとformタグの組み合わせ
-
テーブルの一部分のセルだけに...
-
Firefoxを使ってるのですがズー...
-
同じクラス名はつけないほうが...
-
cssで、テーブルのtdの中の文字...
-
vbscriptで時計を作りたい
-
リストの記号を括弧付きの文字...
-
テーブルのセル内の隙間を取れ...
-
Visual Studio で CLR 開発でデ...
-
Tableタグ内のspan styleが適応...
-
formのinputなどの幅100%指定
-
td要素内のdiv要素をセンタリン...
-
htmlで画像の上にテキストを表...
-
HTMLのテーブルでそれぞれの大...
-
HPに載せる写真にかっこいい...
-
ブラウザの文字サイズを変える...
-
Tableタグで作成した表の縮小
-
divで囲んだ文字が消える
-
TABLEのセルの中の文字を行単位...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
html でのテキスト結合について
-
tableタグとformタグの組み合わせ
-
テーブルの一部分のセルだけに...
-
同じクラス名はつけないほうが...
-
テーブル内のテーブルの高さを...
-
XHTMLに関する質問 順序が逆に...
-
Tableタグ内のspan styleが適応...
-
Tableタグで作成した表の縮小
-
ブラウザによってテーブルのセ...
-
cssで、テーブルのtdの中の文字...
-
td要素内のdiv要素をセンタリン...
-
vbscriptで時計を作りたい
-
formのinputなどの幅100%指定
-
Firefoxを使ってるのですがズー...
-
テーブルの枠線に色が付かない
-
divで囲んだ文字が消える
-
TDタグ内での均等割付の仕方
-
表とリスト(ulとtable)の違い...
-
firefoxで「height: 100%;」と...
-
<img>タグにCSSのclass設定可能?
おすすめ情報