invalid property value

このQ&Aのポイント
  • ソースコード内には「td.td_品目名{padding:10;}」と記述されていますが、適用されません。デベロッパーツールで確認したところ、「invalid property value」というエラーメッセージが表示されました。
  • 問題の原因は、style指定の中に全角の空白が含まれていることです。解決策としては、style指定のコードから全角空白を削除する必要があります。
  • ただし、cssのソースコードを確認しても空白は見つかりませんでした。そのため、別の原因が考えられます。paddingの使用方法に問題がないか、他の部分で同じプロパティが使用されていないかを確認してください。
回答を見る
  • ベストアンサー

invalid property value

ソースは <td class="td_品目名"> なっており、 cssで td.td_品目名{ padding:10; } としたのですが、 実際は適用されません。 デベロッパーツールで確認した所、 △マークが付き、横線が引かれていません。 △マークにカーソルを当てると 「invalid property value」と表示されます。 ググって http://aqsky.blog.fc2.com/blog-entry-2.html を見たのですが、 ------------------------- <原因> style指定の中にどうやら全角の空白が入っていることが原因。 <解決法> style指定のコードから全角空白を解除 ------------------------- との事ですが、cssのソースを見ても空白は入っていません。 どうして適用されないのでしょうか? css内でpaddingは他では使っていません。

  • CSS
  • 回答数1
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
  • DrFell
  • ベストアンサー率55% (305/551)
回答No.1

cssは単位が必要です。

nlcshpiggfgl
質問者

お礼

回答頂きありがとうございました。

関連するQ&A

  • invalid property value

    cssで invalid property value と言うエラーが出るのでググってみたら、 http://zatomiya.blogspot.jp/2013/06/cssinvalid-property-value.html がヒットして、 <原因> style指定の中にどうやら全角の空白が入っていることが原因。 <解決法> style指定のコードから全角空白を解除 と書いてあるのですが、 コードの中に全角空白はいれていません。 padding-left: -10em; としているのですが、 マイナスの値を設定していることが、 invalid property value のエラーの原因と言う可能性はありますか?

    • ベストアンサー
    • CSS
  • 2列目のみcssを適用させるには?

    <html> <head> <title>test</title> <style type="text/css"> table.test td+td { padding-left:1em; } </style> </head> <body> <table class="test" border=1> <tr><th>No</th><th>タイトル(この列だけ左からの距離を指定する)</th><th>その他</th></tr> <tr><td>1</td><td>bbb</td><td>1</td></tr> <tr><td>2</td><td>ccc</td><td>2</td></tr> </table> </body> </html> このソースだと2列目と3列目にcssが適用されてしまいます。 table.test td+td の部分は、okwaveからのコピペで見よう見まねでやってみたのですが どうすれば「2列目だけ」を指定できますか? このソースでの表示結果は画像の通りです。

    • ベストアンサー
    • HTML
  • padding 一つにまとめるには?css

    <html> <head> <title>test</title> <style type="text/css"> td{padding:10;} </style> </head> <body> <table border=1> <tr><th>a</th><th>b</th></tr> <tr><td>c</td><td>d</td></tr> </table> </body> </html> これで、 cとdの行のtdタグの表の幅は設定できますが、 全ての行の表の幅を1行のcssで設定するにはどうすればいいでしょうか? table{padding:10;} とすると、 表の幅は0になってしまい、テ^ブルの中の幅が広がってしまいます。 tr{padding:10;} にすると何もcssが適用されてないのと同じ状態になります。 th{padding:10;} td{padding:10;} で理想の形になるのですが、 なぜ tableやtrでは出来ないのでしょうか? 1つにまとめられないのですか? 添付画像は理想の形です。

    • ベストアンサー
    • HTML
  • tdのクラスの使い方

    <style type="text/css"> <!-- table { border: 1px red solid; padding:30px 30px; } </style> <body> <table border=3> <tr><td>test</td><td>test</td></tr> <tr><td>test</td><td>test</td></tr> </table> これだと、赤いテーブルの内側のみしかpaddingが有効にならないのですが、 黒いテーブルの枠もpaddingするには、 td { padding:30px 30px; } とするしかないのでしょうか? クラス名を付けて、やりたいテーブルのtdタグだけ適用させたい場合は、 td.aaa { padding:30px 30px; } として、 <table border=3> <tr><td class="aaa">test</td class="aaa"><td class="aaa">test</td class="aaa"></tr> <tr><td class="aaa">test</td class="aaa"><td class="aaa">test</td class="aaa"></tr> </table> のように、すべてのtdタグにクラス名を付けるしかないのですか?

  • table[summary="table_1"]

    table[summary="table_1"] td,th{ padding: 5px 10px; } とスタイルシートで設定した場合、 <table summary="table_2"> のthには、 padding: 5px 10px;は適用されないですよね? 上記のcssでthタグにpadding: 5px 10px;が出来ようされるのは、 "table_1"だけですよね?

    • ベストアンサー
    • CSS
  • Dreamweaverプロパティインスペクタのスタイル

    macOSX 10.4.11、DreamweaverCS3でサイトを作っています。 CSS-------------------------- .cont { padding-right: 20px; padding-left: 20px; width: 800px; } -------------------------------- デザインビューより、スタイル指定したい部分を選択し、 プロパティインスペクタのスタイルのところからスタイルを選ぶと、自動で<span class="cont"></span>で囲まれます。 これを自動で<div class="cont"></div>のように、divで囲みたい場合、どのようにしたらよいでしょうか。

  • スタイルシートのせい?IEのせい?

    自己サイトのリニューアルに伴い、今までゴチャゴチャだったHTMLソースをHTML+CSSで簡潔にしたい、と思って作業を開始したのですが、例えば下記のように (外部スタイルシート) TABLE{ padding-top : 5px;padding-left : 5px;padding-right : 5px;padding-bottom : 5px; border-width : 1px 1px 1px 1px;border-style : solid solid solid solid;border-color : black black black black;} (HTMLその1) <table width="500"><tbody><tr> <td>あああああ</td> </tr></tbody></table> (HTMLその2) <table border="0" cellpadding="0" cellspacing="0" width="500"><tbody><tr> <td>あああああ</td> </tr></tbody></table> と記述しIE6で確認したところ、その2では思った通りの余白(padding)ができるのに、その1ではできませんよね。 CSSに関するページを読みあさる限りではその1の記述の方が正しいと思われるのですが・・・ CSSでpaddingを指定しているのに、わざわざHTMLで0にしなきゃいけないのが納得いかない・・・ これは私のCSSの記述の仕方が悪いのでしょうか? それともIEの解釈によるもの? 本当は上記のようなレイアウトも<div>でやりたいのですが、まだ抵抗があって・・・ このままでは結局以前と同じゴチャゴチャのHTMLソースになってしまいそうです・・・ ちなみにエディタはHPBv6をメインで使っていますが、最終的にはテキストエディタで手直ししています。 他のブラウザではまだ動作未確認です。

    • ベストアンサー
    • CSS
  • サイズ指定したテーブルを縦に並べるとセルがズレる

    色々と試しているんですが解決できないので教えてください。 CSSで全く同じようにサイズ指定しているテーブルを縦に並べた時、同じようにサイズ指定しているはずなのに、IEではセルの内容(テキストの長さ)によってセルの幅が変わってしまいます。具体的に言うと、ショッピングカートの商品ページのようなものを作ろうとしているのですが、以下のようなソースです。 .menu-table{ width:500px; padding:0px; border-collapse:collapse; } .menu-title{ margin:0px; padding:5px; border:1px solid #ff9900; } .menu-img{ width:110px; margin:0px; padding:5px; border:1px solid #ff9900; } .menu-style1{ width:70px; margin:0px; padding:5px; border:1px solid #ff9900; } .menu-style2{ width:300px; margin:0px; padding:5px; } .menu-style3{ margin:0px; padding:5px; } <table width="0" border="0" cellspacing="0" cellpadding="0" class="menu-table"> <tr> <td colspan="3" class="menu-title">商品名</td> </tr> <tr> <td rowspan="4" class="menu-img"><img src="item.jpg" width="100" height="100" /></td> <td class="menu-style1">説明1</td> <td class="menu-style2">あいうえお</td> </tr> <tr> <td class="menu-style1">説明2</td> <td class="menu-style2">かきくけこ</td> </tr> <tr> <td class="menu-style1">価格</td> <td class="menu-style2">\1,000¥</td> </tr> <tr> <td colspan="2" class="menu-style3">あいうえおかきくけこさしすせそたちつてとなにぬねの</td> </tr> </table> こういうテーブルを縦にいくつか並べた時、例えば2つ目のテーブルが「あいうえお」のところに「あいうえおかき」と入力すると、「あいうえお」と入力したテーブルに比べて「説明1」のセル幅が狭くなってしまいます。Firefoxでは綺麗に揃うんですが、どうしてもIEではずれます。ボーダーの幅のぶんも計算に入れて幅を指定し直してもずれるんです。説明が下手すぎてうんざりかもしれませんが、どなたか解決策が分かれば教えてください。

    • 締切済み
    • CSS
  • CSSについて-細部の設定はどうしていますか?

    CSS外部ファイルでサイト全体のレイアウトを設定した場合、大まかな設定は良しとして 例えば「ここのimageだけはmargin:10pxに設定したい」とか、「ここのtdだけはpaddingを5pxにしたい」など 細部の設定について皆さんはいかがしていますか? 1. 細部の設定は諦める(細部にはこだわらない) 2. <td style="padding: 5px">など直接styleを設定する 3. スタイルシートファイルに.td{padding: 5px}を追加する これ位しか思い浮かばないのですが、何か良い方法はないでしょうか。

    • ベストアンサー
    • HTML
  • CSSでtext-align

    不思議な現象が起きてます。 2行7列の表を作って、 2行目の3~5列と7列目を右寄せにしたいがために、 <td class="right"> で外部CSSに .right{ text-align:right; } と記述したところ適用されませんでした。 しかしインラインで <td style="text-align:right;"> と書くと右寄せになるんです・・・ 原因がわからずこまっています。 ちなみに <td align="right"> でも表示されませんでした・・・ table全体には以下のCSSが外部で適用されてます、 div.gray_box { background-color: #FFFFFF; border-color: #CCCCCC; border-style: solid; border-width: 1px; padding: 1px 0 1px 0; } table.wide_table_border { border: 1px solid #FFFFFF; border-collapse:collapse; margin: 0px auto; padding: 5px; width: 100%; } あまり関係ないとは思うのですが一応載せておきます。 目的としては、必ず外部CSSに記述することです。

    • ベストアンサー
    • HTML

専門家に質問してみよう