css保证金不适用于jsf

Question

我有下面的jsf代码和css代码。我无法让css margin属性生效。除边缘外，所有其他属性都可以正常工作我做错了什么？

请注意.contentDialog css类适用于p：dialog。我期望的是围绕h的100px边距：f：facet name =“header”中包含的outputText。但它没有发生。

我已经在IE 7，IE 8，FireFox 7.0.1和Chrome 16.0.912.63 m上进行了测试。所有浏览器都存在相同问题另外，我正在使用PrimeFaces。

JSF CODE

<h:form id="newContentForm">
    <p:dialog header="New Menu Item Type..." widgetVar="newWidget" 
              resizable="false" showEffect="explode" hideEffect="explode" modal="true" closable="false"
              styleClass="contentDialog" width="440">
        <h:panelGrid id="newPopUpWindow" column="1">
            <!-- Grid Header -->
            <f:facet name="header">
                <h:outputText value="New information"/>
            </f:facet>

            <!-- Grid Body -->
            <h:outputText value="Description:"/>
            <p:inputText id="newDescriptionInText" value="#{menuItemTypeContent.selectedContent.menuItemTypeDescr}">         
                <p:ajax process="@this"/>
            </p:inputText>

            <!-- Grid Footer -->
            <f:facet name="footer">
                <!-- Dialog command bottons -->
                <h:panelGroup>
                    <!-- Submit -->
                    <p:commandButton value="Submit" image="ui-icon ui-icon-check"
                                     actionListener="#{menuItemTypeContent.save}"
                                     oncomplete="handleNewRequest(xhr, status, args)"/>
                    <!-- Cancel -->                                             
                    <p:commandButton value="Cancel" image="ui-icon ui-icon-close" 
                                     actionListener="#{menuItemTypeContent.clearContent}" 
                                     onclick="newWidget.hide()" type="reset"/>
                </h:panelGroup>                             
            </f:facet>                             
        </h:panelGrid>

        <!-- Submit javascript handler -->    
        <h:outputScript>
            function handleNewRequest(xhr, status, args) {
                if (args.duplicateSaveError) {
                    duplicateError.show();
                }else if (args.illegalStatusError) {
                    deleteError.show();
                }else if (args.validationFailed) {
                    newContentError.show();
                }else {
                    // Hide new content dialog box if add happened without exceptions
                    newWidget.hide();
                }
            }
        </h:outputScript>   
    </p:dialog>    
</h:form>   

CSS CODE

.contentDialog {
    font-size:13px;
    border:2px solid #2D65B0;   
}

.contentDialog table {
    border:1px solid #8DB1E2;
    width:100%;
}
.contentDialog th {
    background-color:#2D65B0;
    width:100%;
    text-align:left;
    color:red;
    margin:100px;
}

Answer 1

这与JSF无关，而是与CSS和html有关。您不能使用边距来设置表格单元格的样式。您可以使用的是整个表格的cellspacing属性或单个单元格的填充。您可以在此question下找到更多信息。