• 締切済み

CSSでボックスにborderをつけたが、画面からずらすと線が消える？

CSSで border-style:solid; のように、ボックスの枠線をつけたのですが、スクロールして、出来た枠線を一度画面から見えないようにして、すぐ戻す（枠線が見える部分にスクロールする）と、枠線が消えてしまうのですが、何か解決策はあるでしょうか？ よろしくお願いします。

  • HTML
  • 回答数2
  • ありがとう数1

みんなの回答

noname#100277
noname#100277
回答No.2

HTMLとCSSのコードはどう成ってますか？ 該当する箇所（DOCTYPEから含む）を出して下さい。

全文を見る
すると、全ての回答が全文表示されます。
  • naokita
  • ベストアンサー率57% (1008/1745)
回答No.1

その様な現象が再現出来ないのでわかりませんが、 border: 1px solid #000 ;　とかでも同じですか？

全文を見る
すると、全ての回答が全文表示されます。
  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • ｃｓｓ　の「border」に関して

    CSSの「枠線の幅」と「枠線の太さ」について教えてください。 「枠線の幅」も「枠線の太さ」とも、設定は『border:width』となるようですが、どのような使い分け方をするのでしょうか？

  • CSSで枠線の太さを変えるとき

    CSSでlistタグを使ってナビゲーションを作る練習をしています。 CSSで以下のように書いた場合、a:hover時の動作として、上の枠線のみが１pxから5pxに変わります。しかし、この方法だと、【上の枠線の下】が5pxとなり、その分、入力してある文字が下にずれます。 そこで、ずれないように、【上の枠線の上】に5px増やすにはどうすればいいでしょうか。 あるいは、そのように見せるための方法がありますか。画像は使用しないで作りたいです。 よろしくお願いします（CSSは初心者程度のレベルです）。 ================================================== ul{ list-style-type:none; } a{ text-decoration:none; } li a{ border-top-style:solid; border-right-style:solid; border-bottom-style:solid; border-left-style:solid; border-top-width:1px; border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-top-color:red; border-right-color:green; border-bottom-color:green; border-left-color:green; width:8em; } li a:hover{ border-top-style:solid; border-right-style:solid; border-bottom-style:solid; border-left-style:solid; border-top-width:5px; border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-top-color:red; border-right-color:green; border-bottom-color:green; border-left-color:green; width:8em; } ==================================================

    • ベストアンサー
    • CSS
  • cssを使った枠線の表示について

    css初心者です。宜しくお願いします。 タグ打ちしたHTMLファイルとcssファイルがあります。 cssファイルに「.waku {BORDER-WIDTH:5px;BORDER-COLOR:#FFFFFF;BORDER-STYLE:SOLID}」と記述し、 HTMLに「<P CLASS=waku>適当な文字列</P>」としました。 この、「適当な文字列」の周りに5pxの白い枠線が表示されたところまではうまくいったのですが、画面の左右いっぱいまで枠線が延びています。 (1)文字列の幅に合わせて、自動的に枠の幅を変えるにはどうすればいいのでしょうか？ (2)この枠の幅を「画面の50%」あるいは「500px」などと指定することは可能でしょうか？ (3)文字列と枠線との間隔を調整することは可能でしょうか？ 余談ですが、cssの記述の際、スペースを多様している例をよく見かけます。 冒頭での私の書き方でも正常に動作しているようですが、「.waku { BORDER-WIDTH : 5px ; BORDER-COLOR : #FFFFFF ; BORDER-STYLE : SOLID }」このように (4)各文字列や値の前後にスペースを入れる理由を教えてください。

  • ホームページ　点線の入った表の書き方（CSSを使って）

    表を作っています。 何度もチャレンジしながらやりましたが・・ギブアップ・・・分かりません。。わかる方がいらっしゃったら教えてください。 http://hw001.gate01.com/with-flower/tesuto/article04.html (1)1つの枠の中（物件）で区切りに点線を入れたいのですが、どのようにしたらいいでしょうか？ (2)上下に重なった枠線を片方だけにできないでしょうか？ または改行を入れようと思ったのですが、間隔が広すぎておかしくなります。改行幅の指定はできるのでしょうか？ ↓CSS .solid {border-width:1px; border-style:solid; border-color:#330000;} .dashed {border-width:1px; border-style:dashed; border-color:#cccccc;}

  • CSSでテーブルボーダーを一発指定出来ません！

    現在テーブルに対してのCSSを設定しているのですが、私の勘違いなのかうまく出来ません・・・。 例えば縦5×横5列の表が有ったとします。 そこにCSSで四方1pxのボーダーを指定します。 でも、これだけだと表の一番外枠部分にしかボーダーが表示されません・・・。（当然なのかもしれませんが） そこで、CSSを使い中のブロック？部分、<td>全てにボーダーを表示させたいのですが、そのようなことは可能なのでしょうか？ ようは、表の枠線全てをcssで表示させたいのですが、この様な事は可能でしょうか？？ ご存知の方がいましたら、アドバイスいただけますでしょうか？ 宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • cssでボーダーを消したい

    こんにちは。 CSSのことで質問させてください。 リンクした文字色、ボーダーなどが出ないようにしたいのですが、 一部分、Firefoxで見ると、 文字色が紫で、ボーダーがでます。 *{ margin: 0; padding: 0; font-size: 100%; list-style: none; } と、リセットしています。 一部分の<ul>だけに効いていません。 どのようなことが原因として考えられるでしょうか。 どなたかよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • テキストをボーダーで囲むCSS

    CSSを本を見ながらやっていますが、 下記の例文でテキストをボーダーで囲むものをやってみました。 この中で、 margin-left:100px; margin-right:100px; というころですが、これはブラウザに対しての両サイド空きを意味していると思うのですが、逆に囲んでいる幅のほうを指定するにはどうしたらよいのでしょうか。 または、そのようなことはできないのでしょうか。 <STYLE TYPE="text/css"> <!-- P.text {text-align:justify; text-justify:distribute; line-height:154%; margin-left:100px; margin-right:100px; border-style:solid; border-width:2px; border-color:#dd8888; padding:10px} --></STYLE> *****HTML <P CLASS="text"> テーブルみたいになるテキスト</P>

    • ベストアンサー
    • HTML
  • NN使用でのCSSでのBORDERについて

    IEで TD.TD1{BORDER-STYLE:SOLID; BORDER-COLOR:CORNFLOWERBLUE; BORDER-WIDTH:1; BACKGROUND-COLOR:ALICEBLUE;} のように指定すれば、細い線で囲まれたものをかくことができますが、NNでは、背景色は有効になっても線が出てきません。 これを有効にするにはどのようにしたらいいのでしょうか？ また、IE・NNで表示結果が違うCSSの一覧などが載ってるような便利なサイトがもしあったら教えてください。

    • ベストアンサー
    • CSS
  • html/CSSでBOX内にBOXを作り、その両方に異なる<h2>タグ

    html/CSSでBOX内にBOXを作り、その両方に異なる<h2>タグを設定したい。 具体的には、 -------------------------------------------- #box1{・・・・・・} #box1 h2{ font-size:14px; border: solid red 1px; width: 800px; } #box2{・・・・・・} #box2 h2{ font-size:10px; border: solid blue 1px; width: 400px; } -------------------------------------------- というCSSがあり、html上ではbox1の中にbox2が入っています。 -------------------------------------------- <div class="box1"> <h2>あああああ</h2> <div class="box2"> <h2>いいいいい</h2> </div> </div> -------------------------------------------- このとき、CSSの「box1のh2タグの設定」がbox2内のh2タグにおいても反映されてしまいます。 box2内では「box2のh2タグの設定」を反映させたいのですが、どうすればできるのか 教えていただけますでしょうか。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • CSSでのレイアウト（Firefox向け）

    下のようなレイアウトをCSSで行いたいと思っています。しかし意図するような表示にFireFoxではなりません。FireFoxではどのようにすれば上手くいきますでしょうか？（上手くアスキーアートが書ければいいのですが、、、センタリングされたBOXの中で、さらにBOXが2つ並ぶというようなものです。） 　　　┌──────────────┐ 　　　｜┌─────┐┌─────┐│ 　　　｜｜TEXT　　　　｜｜TEXT　　　　｜｜ 　　　｜｜　　　　　　　　｜｜　　　　　　　｜｜ 　　　｜└─────┘└─────┘│ 　　　└──────────────┘ <html> <head> <style type="text/css"> body { margin: 10; text-align: center; } #canpas { border-style:solid; width: 700px; } #box { margin: 10; border-style:solid; width: 300px; float: left; } </style> </head> <body> <div id="canpas"> <div id="box">testtesttest</div> <div id="box">testtesttest</div> </div> </body> </html> ぜひよろしくお願いします。

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する