0

私が次のようなものを書くとき：

<table style="margin-left: 30px;" >
</table>

また：

<div style="margin-left: 30px;">
            <h:commandButton value="add" action="a"></h:commandButton>
            <h:commandButton value="cancel" action="b" immediate="true"></h:commandButton>
</div>

マージンが正しく表示されます。

しかし、私が書くとき：

<table class="marg" >
</table>

また：

<div class="marg">
    <h:commandButton value="add" action="a"></h:commandButton>
    <h:commandButton value="cancel" action="b" immediate="true"></h:commandButton>
</div>

このルールで：

.marg {
    margin-left: 50px;
    margin-top: 30px; 
}

HTMLで生成されたコード：

<table class="marg">
</table>
<div class="marg">
<input id="j_id1109917403_4227fec1:j_id1109917403_4227feb3" type="submit" value="add" name="j_id1109917403_4227fec1:j_id1109917403_4227feb3">
<input id="j_id1109917403_4227fec1:j_id1109917403_4227feae" type="submit" value="cancel" name="j_id1109917403_4227fec1:j_id1109917403_4227feae">
</div>

表とボタンは余白なしで表示されます。なんで ？

4

3 に答える 3

1

  1. background-color：を追加して、CSSルールが適用されているかどうかをテストします。

    .marg {
  margin-left: 50px;
  margin-top: 30px;
  background-color: pink;
}

  2. はいの場合は、テスト目的で既存の命令に追加!importantします。

    .marg {
  margin-left: 50px !important;
  margin-top: 30px !important;
  background-color: pink;
}
    1. 適用されているルールをFirebug/Inspectorで調べます。多くの宣言がある場合、その宣言には！important修飾子があるか、他の宣言よりも特異性があるか、最後に来て最終的に適用されます。

CSSは適用されていますか？!important何かを変えますか？Firebugには何が表示されますか？それでも問題が解決しない場合は、（CSSをリセットせずに）フィドルで戻ってきてください。HTMLおよびCSSコードは、問題を理解するのに役立ちます。HTMLを生成するバックエンドコードは生成しません

于 2013-03-02T21:21:48.000 に答える
0

ああ、ごめんなさい、それは私の非常に愚かな間違いでした。HTMLで追加するのを忘れています：

<link rel="stylesheet" type="text/css" href="style/myCSS.css"   media="all" />

追加したと思いました。

于 2013-03-02T21:39:32.160 に答える
-1

.marg cssクラスでは、30pxに設定されている属性の内部とは異なり、margin-leftが50pxに設定されています。

于 2013-03-02T21:07:06.540 に答える