2

我已经开始使用 PrimeFaces p:editor进行文本输入，而且在大多数情况下，我对它的工作方式相当满意。但是文档指出，它所基于的 CKEditor 没有插入 ThemeRoller 框架，因此组件尺寸不会自动调整。

例如：

<h:panelGrid columns="2">

    (stuff)

    <h:outputLabel value="Content:" />
    <p:editor id="editDoc" widgetVar="editorDoc"
                 value="#{editDocument.text}"
                 style="width: 700px"
                                  />

    (more stuff)
</h:panelGrid>

我希望p:editor扩展到h:panelGrid呈现的表格的宽度。然而，我没有尝试过任何工作。有什么建议么？

更新：

我应该注意到p:editor标记不注意样式属性。相反，它有一个宽度属性和一个高度属性，它们的工作方式与 CSS 参数的工作方式不同。例如width="100%"是一个错误。

4

2 回答 2

5

的实际宽度p:editor取决于其内部的大小<div>。您可以简单地覆盖该默认值：

<style type="text/css">
    #editDoc > div {
        width: 99.5% !important;
    }
</style>

也删除 thestyle="width: 700px"并将p:editor其附加到 theh:panelGrid上。

适用于所有组件的更通用的解决方案p:editor是覆盖类的默认width属性.ui-editor：

<style type="text/css">
    .ui-editor {
        width: 99.5% !important;
    }
</style>
于 2012-10-24T06:56:07.457 回答
1

对于 Primefaces 4，我们必须设置内部的宽度iframe：

<style type="text/css">
    .ui-editor iframe {
        width:100% !important;
    }
</style>
于 2014-03-20T08:18:56.877 回答