Operaのバージョン9で以下のCSSが正常に動作しません。
症状:リンクにマウスオーバーしても下線が表示されない。
使用OS:Windows XP SP2
<html>
<head>
<style type="text/css">
a { text-decoration: none; }
a:hover { text-decoration: underline; }
</style>
</head>
<body>
<ul>
<li><a href="#">sample</a></li>
<li><a href="#">sample</a></li>
<li><a href="#">sample</a></li>
</ul>
</body>
</html>
この問題を解決するにはどうすればよいのでしょうか?
ご存知の方がおられましたらご回答をよろしくお願いします。
A 回答 (4件)
- 最新から表示
- 回答順に表示
No.4
- 回答日時:
フォントサイズは12pxや120%でも下線が見えました。
出ているのでしょうが、フォントサイズの問題で見えないようですね。
Opera9でのtext-decoration: none/underlineの挙動が怪しいという報告を見たことがあるので、サポートに報告もいってるんじゃないでしょうか。
Operaでの標準フォントサイズをいじっておくという手もありますが(笑)根本的な解決にはならないので、Weekly Buildが進めば改善されるだろうと割り切ってしまうか、どうしても我慢できなければ率先してフォーラムやMLで投稿してみてもいいかもしれません。
この回答への補足
確かにほかにも同じような症状の方をよく見かけます。
しばらくはfont-sizeを99%以下に設定することで解決しようと思います。
No.3
- 回答日時:
>最初は3つとも下線が表示されていなくて
マウスオーバーしたときにのみに下線が表示されるということでしょうか?
その動作です。ソースでもa: hoverでオンマウス時にアンダーライン表示になっていますし、Operaのエラーコンソールにもエラーは出てきていません。
確認したのは、
Windows XP SP2 Opera9.10
Mac OS 10.4.8 Opera9.02
です。。。
念の為、CSSをちょっと丁寧に
<style type="text/css">
<!--
a:link {
text-decoration: none;
}
a:active {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
-->
</style>
と記述してみても変わりませんか?
この回答への補足
上記の記述にしてみたのですが特に変化はありませんでした。
念のため同じOSが入っているノートパソコンの方にOperaをインストールして
動作検証をしてみたのですが、こちらの方は問題なく動作しました。
ちなみにfont-sizeを99%以下に設定することで、この問題を解決できるのことが
いろいろと試してみた結果わかったのですが、なぜこのような現象が起きるのかは不明です。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS cssの display: flex;で横並びにならずに困ってます 1 2022/12/04 13:18
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS htmltとcssの連携をして画像縮小について 1 2022/11/15 20:32
- HTML・CSS CSSが上手く反映されないみたいです 2 2022/11/21 16:19
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSSが上手く反映されないみたい...
-
htmlの<ol>タグで、数字などを...
-
<table>の高さ固定。情報増加時...
-
ulタグやliタグの中でbrタグ...
-
li 長さ指定
-
真横に展開するドロップダウン...
-
ページを開いているときのリン...
-
display:table;を多段表示させたい
-
URLにアクセスした際に指定した...
-
プルダウンメニューの背景色を...
-
HTMLのdlとul どちらが正しいと...
-
html <ul></ul>の並びで一行空...
-
サイドバーの作り方を教えてく...
-
リストの数字のフォントサイズ...
-
【CSS】メニュー上部に固定させ...
-
リストマーカーをボックス内に...
-
html/cssの、navを2段にする...
-
liタグの中に<p>タグやら<dl>を...
-
CSSでつくったメニューのアニメ...
-
pythonリストの特定の値を表示h...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
リストマーカーをボックス内に...
-
liタグの中に<p>タグやら<dl>を...
-
divタグ内のコンテンツが重なっ...
-
リストの数字のフォントサイズ...
-
html/cssの、navを2段にする...
-
レスポンシブWebデザインでリン...
-
ulタグやliタグの中でbrタグ...
-
複数行にまたがる括弧を表示し...
-
<table>の高さ固定。情報増加時...
-
画像にリンクを張ると画像がず...
-
html <ul></ul>の並びで一行空...
-
<ul><li></li></ul>にするメリ...
-
ページを開いているときのリン...
-
HTMLで組織図を作成する方法
-
リンク文字同士の間隔を開ける...
-
htmlの<ol>タグで、数字などを...
-
ボタンを横に並べて表示させる方法
-
bxsliderの画像が左によってしまう
-
番号付きリスト(<Ol><Li>・・...
-
HTMLもしくはCSSのULでリンクを...
おすすめ情報