- ベストアンサー
スタイルシートのheightについて
お詳しい方どうか教えてください。 スタイルシートを使用してある文字列を、罫線で囲みたいと思っております。 以下のタグを作成したのですが、height=280が効いていないようなのです。 使用ブラウザは古いのですがNN4.51です。"height"はNN4.51では対応されていないのでしょうか？ 作成タグは以下です。 <SPAN STYLE="width: 650px; height: 280px; border: solid 1px black; background: white; color: white;">・・・・<SPAN> どうかよろしくお願いします。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
その他の回答 (1)
- arikui
- ベストアンサー率43% (52/120)
残念ながらNN4.51では対応していないようです。 参考URLをご覧になってください。
お礼
早速の回答ありがとうございます。 いい情報(URL)を頂きました。今後活用させていただきます。
関連するQ&A
- スタイルシート line-heightのバグ？
ホームページの中で、行幅をあけるのに、line-heightを使っています。 簡潔なタグは以下の通りです。 <html> <body> <span style="font-size:13px; line-height:160%;"> <img src="image/point.gif" border=0 width=6 height=8 alt="">てすと1<br> <img src="image/point.gif" border=0 width=6 height=8 alt="">てすと2<br> </span> </body> </html> 「てすと1」「てすと2」の前に小さな画像を入れています。 WinXP、NN4.XやN7.Xで見た場合は、画像が入っていても問題なく行幅が開きますが、 WinXP、IE6.02で見ると、line-heightが効きません。 これはIEのスタイルシートバグなのでしょうか？ また、打開方法ありましたらお願いします！ （参考まで：テーブルタグを使いたくないのでline-heightで行間をあけています）
- ベストアンサー
- HTML
- 表の作成をスタイルシートで
皆さんはHTMLで表を作成する際、どのように作成していますか？ 私はTableタグとスタイルシートを使っているのですが、これをスタイルシートのみで 作成できないでしょうか。 例えば以下のような表で、■部分は他のセルと背景色を変えます。 ■□□ ■□□ ■□□ 通常私がやっている方法は、tableタグに下記スタイル「tb01」を、タイトル部分には 「td.title」を設定を設定しています。 -----------------HTML-------------------------- <table width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="title">6月7日</td> <td>text</td> <td>text</td> <td>text</td> </tr> <tr> <td class="title">6月8日</td> <td>text</td> <td>text</td> <td>text</td> </tr> </table> ---------------------------------------------------------- -----------------スタイルシート-------------------------- .tb01 {FONT-SIZE: 12px; border-collapse : collapse ; border-width : 1px 0 0 1px ; border-style : solid ; border-color : #CDCDCD ; ; width:350px; background-color:#FFFFFF; } table.tb01 td {border-width : 0 1px 1px 0 ; border-style : solid ; padding : 7px ; line-height:120%; border-color : #CDCDCD ; } td.title {background-color:#ECECEC; } ---------------------------------------------------------- スタイルシートのみでは無理でも、もっと良い方法があれば 是非教えてください。
- ベストアンサー
- HTML
- liタグのナビボタンがFirefoxで二重に表示。
liタグでナビボタンを縦に３つ積みたいのですが、IEでは正しく表示しますが、何故かFirefoxでは２段めから２つずつ表示してしまい５つのナビボタンになってしまいます。どのように記述すれば良いのでしょう？ <div id="sidebar"> <ul> <li id="aaa"><a href=""><span>aaa</span></li> <li id="bbb"><a href=""><span>bbb</span></li> <li id="ccc"><a href=""><span>ccc</span></li> </ul> </div> div#sidebar { width: 245px; float:left; border-right-width: 1px; border-right-style: solid; border-right-color: #CCCCCC; } div#sidebar ul li a { display: block; } div#sidebar ul li a span { position:absolute; width: 0; height: 0; overflow:hidden; } ul li#aaa a { width: 245px; height: 60px; background-image:url(image/aa.jpg); background-position: 10px 20px; background-repeat: no-repeat; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999999; } ul li#bbb a { width: 245px; height: 60px; background-image:url(image/bb.jpg); background-position: 10px 20px; background-repeat: no-repeat; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999999; } ul li#ccc a { width: 245px; height: 60px; background-image:url(image/cc.jpg); background-position: 10px 20px; background-repeat: no-repeat; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999999; }
- ベストアンサー
- CSS
- スタイルシートで罫線をもっと細くしたい
IE6.0です、 テーブルの罫線をもっと細くしたいのですが、 border-widthは1pxが一番細いのでしょうか？ この教えてgooくらい細くしたいのですが 他にやり方があれば教えてください。 TABLE { border-color: #8b4513; padding: 1px 1px 1px 1px; margin: 1px 1px 1px 1px; border-style: solid; border-width: 1px 1px 1px 1px; } 宜しくお願いします、
- ベストアンサー
- HTML
- ホームページビルダーでスタイルシートを使ったのですが？
今、ホームページビルダーで簡単な2カラム（右メニュー）のテンプレートを作っています。 質問ですが、メニューバー（サイドバー）に色を付けたくて、画像を使う事にしました。 <div class="main">に画像（background.gif）を入れ属性で繰り返す（垂直方向）にチェックをいれたのですが、ＩＥやfirefoxでプレビューでは反映されていないです。 色々いじってみたのですがどうしても解りません。どこが間違っているのか教えていただけないでしょうか？ よろしくお願いします。 HTML <body> <div class="box"> <div class="header"> <span class="site_name">ここにサイト名を入れる</span> <h1>ここにｈ１</h1> <div class="description_1">ここに簡単な説明文</div> </div> <div class="main"> <div class="contents">コンテンツ部分<br /> </div> <div class="menu"> メニュー部分 </div> </div> <div class="footer"> フッター部分 </div> </div> </body> スタイルシート * { margin:0; padding:0; } .box{ width : 750px; margin: 0 auto; border-left-width : 1px; border-left-style : solid; border-left-color : black; border-right-width : 1px; border-right-style : solid; border-right-color : black; border-bottom-width : 1px; border-bottom-style : solid; border-bottom-color : black; } .header { width : 726px; height : 96px; background-color : #b9b9ff; padding-top : 12px; padding-left : 12px; padding-right : 12px; padding-bottom : 12px; border-bottom-width : 2px; border-bottom-style : solid; border-bottom-color : black; } .main { width : 750px; background-image : url(file:///C:/Documents and Settings/※※※/img/background.gif); background-repeat : repeat-y; background-position : 0px 0px; margin-top : 0px; margin-bottom : 0px; margin-left : auto; margin-right : auto; background-color : #ffffff; } .menu { float: left; width : 180px; padding-top : 10px; padding-left : 10px; padding-right : 10px; padding-bottom : 10px; margin-left : auto; margin-right : auto; } .contents { float: left; width : 526px; padding-top : 12px; padding-left : 12px; padding-right : 12px; padding-bottom : 12px; } .footer { clear: both; width : 726px; height : 26px; background-color : #b9b9ff; padding-top : 12px; padding-left : 12px; padding-right : 12px; padding-bottom : 12px; text-align : center; } .menu ul { list-style: none; } .site_name{ font-size : 21px; font-weight : bold; margin-left : 12px; } h1{ font-size : 15px; margin-top : 12px; margin-left : 24px; } .description_1{ font-size : 12px; font-weight : normal; margin-left : 24px; }
- ベストアンサー
- ホームページ作成ソフト
- スタイルシートでのデザイン
HTMLを組む際、今までレイアウトはtableタグで組んでいたのですが、CSSで組もうと思っています。 例えば、 <table align="center"> <tr> <td colspan="2" width="500" height="80">aaa</td> <td rowspan="2" width="300" height="200">bbb</td> </tr> <tr> <td colspan="2" width="500" height="20">ccc</td> </tr> <tr> <td width="200" height="100">ddd</td> <td width="300" height="100">eee</td> </tr> </table> をスタイルシートで配置しようと思い、 <div align="center" style="width:800px"> <div style="float:left;width:500px;height:80px;background-color:#ff9999">aaa</div> <div style="float:right;width:300px;height:200px;background-color:#9ff999">bbb</div> <div style="float:left;width:500px;height:20px;background-color:#9999ff">ccc</div> <div style="float:left;width:200px;height:100px;background-color:#99ffff">ddd</div> <div style="float:center;width:300px;height:100px;background-color:#ffff99">eee</div> </div> としたのですが、センタリングされないのと、eeeの箇所がdddの隣に来ないで次の行に移ります。 うまく出来ないので、どなたか教えて下さい。お願いします。
- ベストアンサー
- CSS
- スタイルシート
<!-- span#k-11 { background-image : url("a.gif")} span#k-12 { background-image : url("b.gif")} span#k-21 { background-image : url("c.gif")} span#k-22 { background-image : url("d.gif")} --> <body> <table> <tr> <td><a href=""><span id="k-11" style="width:192; height:33;"></span></a></td> <td><a href=""><span id="k-12" style="width:192; height:33;"></span></a></td> </tr> <tr> <td><a href=""><span id="k-21" style="width:192; height:33;"></span></a></td> <td><a href=""><span id="k-22" style="width:192; height:33;"></span></a></td> </tr> </table> </body> 外部スタイルシートで、 同じ大きさ（width:192; height:33; gif画像の大きさ）のgif画像を、縦２×横２のテーブルを表示して、その個々の画像にリンクを貼りたいと思っています。 一応これできますが、もう少しbody内のテーブルを簡略したいと思いますが、なかなかうまいきません。 １．大きさの部分（width:192; height:33;）をスタイルに入れると、何故か画像が表示されなくなります。 ２．リンクの部分もスタイルに入れたいのですが、どのようにすればよいかわかりません。 どうぞご指導よろしくお願いします。
- 締切済み
- その他（プログラミング・開発）
- スタイルシートテーブルの罫線を細くしたい
例えば以下のようにHTMLを書いた場合、 tableとtdのスタイルシート指定により、 外枠と内枠で罫線がかさなり、 若干太くなってしまいます。 細くしたいのですが、どうすれば出来るのでしょうか？ <table style="{border:1px solid #000000;border-spacing:0px}"> <tr> <td style="{border:1px solid #000000;padding:0px}">あああ </td> <td style="{border:1px solid #000000;padding:0px}">いいい </td> </tr> </table>
- ベストアンサー
- その他（インターネット・Webサービス）
- Opera（10.10）でのスタイルシートの表示について
Opera（10.10）でのスタイルシートの表示について Operaでのスタイルシートの「border」の表示について質問させて下さい。 これは例ですが、HTMLとCSSを以下のとおりに設定しているとしますね。 ------------------------------------------------------------------ <body> <div id="layout"> <div id="box1"> <p>ボーダーのテスト</p> </div> </div> </body> ------------------------------------------------------------------ *{ margin : 0px; padding : 0px; } #layout{ width : 800px; height : 600px; padding : 10px; margin-left : auto; margin-right : auto; background-color : #FFF; } #box1{ width : 780px; height : 580px; padding : 10px; border-top : solid 1px #D1D1D1; border-left : solid 1px #D1D1D1; border-right : dashed 1px #D1D1D1; border-bottom : dashed 1px #D1D1D1; background-color : #FFF; } ------------------------------------------------------------------ このように設定した場合、「id="box3"」のボーダーは上と左が直線、 右と下が点線と表示されるのが正しい表示だと思います。 しかし、Operaで閲覧した場合なぜか「border-left」のみ表示されません。 「border-left」を「solid」から「dashed」に変更すると表示されます。 borderに合わせてwidthもちゃんと横に伸びているので、 CSSが適用されていないわけではないと思います。 また、「border-left」を「dashed」から「solid」に変更した場合には、 「border-top」と「border-right」の両方が見えなくなってしまいます。 どちらの問題も、IE6やFirefox（3.5.7）では指定通り正しく表示されました。 Operaでも同様に正しく表示させるにはどうすればよいのでしょうか。 よろしくお願いいたします。
- ベストアンサー
- HTML
- 外部スタイルシートへの記入方法について
外部スタイルシートへの記入方法について 下記ボックスを利用したいのですが 外部ファイルにまとめて記載できたらと思いましたがどうも上手くいきません。 どなたか詳しい方にご教授願えないでしょうか、 よろしくお願い致します。 <div class="box_01"> この中にタイトルを記載と 本文を記載する </div> <TABLE width="400"><TR><TD> <DIV style="width : 400px"> <DIV style="border-width : 1px;border-color : #333333 ;border-style : solid"> <DIV style="border-width : 1px;border-color : #FFFFFF #999999 #999999 #FFFFFF;border-style : solid;"> <DIV style="background-color : #D0D0D0;padding : 1px"> <DIV style="padding : 3 3 4 3px;text-align : center">- タイトル -</DIV> <DIV style="border-width : 1px;border-color : #999999 #FFFFFF #FFFFFF #999999;border-style : solid;"> <DIV style="border : 1px #333333 solid;background-color : #FFFFFF;padding : 10px;"> <br><hr> ↓<BR> ↓<BR> <center> ↓<BR> ↓<BR> </center> ↓<BR> ↓<BR> <hr> </DIV> </DIV> </DIV> </DIV> </DIV> </TD></TR></TABLE> くれくれで恐縮ですがどうぞよろしくお願い致します。
- ベストアンサー
- CSS
お礼
早速の回答ありがとうございます。 私も必要性を感じておりましたので、これを機会に購入したいと思います。