Xpages无法控制表格行表格中的间距

时间:2015-08-31 17:36:58

标签: xpages xpages-extlib

我无法在表单表格中控制表单布局中的间距。我想在每一行之间留一些空间,所以事情并没有那么紧张。开箱即用它看起来像这样:

enter image description here

我尝试为每一行添加填充和边距,并在CSS库中添加了一些代码:

.lotusForm tr.lotusFormFieldRow td, .lotusForm td.lotusFormFieldRow {
    padding-bottom: 50px;
}

我做错了什么?

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xe="http://www.ibm.com/xsp/coreex">
    <xp:this.data>
        <xp:dominoDocument var="document1" formName="PCInventory"></xp:dominoDocument>
    </xp:this.data>
    <xe:formTable id="frInventory" disableErrorSummary="true"
        disableRowError="true" formTitle="Inventory" labelWidth="100px"
        labelPosition="left">
        <xp:this.facets></xp:this.facets>
        <xe:formRow id="formRow3" labelPosition="inherit"></xe:formRow>
        <xe:formRow id="formRow2" labelPosition="inherit"
            label="Serial Number" style="padding-bottom:20.0px">
            <xp:inputText value="#{document1.computerName}"
                id="computerName1" style="width:150px">
            </xp:inputText>
            <xp:message id="message2" for="computerName1" />
        </xe:formRow>
        <xe:formRow id="formRow8" labelPosition="inherit"
            label="Model">
            <xp:inputText value="#{document1.computerName}"
                id="inputText6" style="width:150px">
            </xp:inputText>
            <xp:message id="message1" for="computerName1" />
        </xe:formRow>
        <xe:formRow id="formRow1" labelPosition="inherit"
            label="Office /Location">
            <xp:inputText value="#{document1.computerName}"
                id="inputText1" style="width:150px">
            </xp:inputText>
        </xe:formRow>
        <xe:formRow id="formRow5" labelPosition="inherit"
            label="Check In Date">
            <xp:inputText value="#{document1.computerName}"
                id="inputText3" style="width:150px">
            </xp:inputText>
        </xe:formRow>
        <xe:formRow id="formRow6" labelPosition="inherit"
            label="Check Out Date">
            <xp:inputText value="#{document1.computerName}"
                id="inputText4" style="width:150px">
            </xp:inputText>
        </xe:formRow>
        <xe:formRow id="formRow7" labelPosition="inherit"
            label="Notes">
            <xp:inputText value="#{document1.computerName}"
                id="inputText5" style="width:150px">
            </xp:inputText>
        </xe:formRow>
    </xe:formTable>
    </xp:view>

我试过的CSS:

.lotusui30 .lotusFormTable td {
  padding-bottom:10px;
}

1 个答案:

答案 0 :(得分:5)

将此css添加到您的XPage:

tr.lotusFormFieldRow > td
{
  padding-bottom: 20px;
}