JSF的outputText溢出

我想，以顯示與下面的代碼在面板內部情況的意見：JSF的outputText溢出

<p:panel> 
    <ui:repeat var="Comment" value="#{Status.commentList}"> 
     <h:outputText value="#{Comment.Text}"/> 
    </ui:repeat> 
</p:panel>

看來當評論有這麼長，文字是從面板四溢。我調查了一下，發現了h:outputText正在產生的跨度，並試圖通過CSS來解決這個問題：

<h:outputText value="#{Comment.Text}" 
    style="width: 100px!important; overflow-x: scroll!important;"/>

給出一個固定的寬度和overflow-x:scroll應該做的伎倆，但它呈現跨度更廣，甚至我已經設置它爲100像素，它將其渲染爲400像素，不會注意到!important。

來源

2013-04-09 Ömer Faruk Almalı

您試圖獲取確切的輸出文本區域，可能會被outputtext的父項捕獲。 – 2013-04-09 08:35:40

看來我忘了一件事：'display：block'解決了問題。 – 2013-04-09 08:38:00

<h:outputText value="#{Comment.Text}" 
    style="width: 100px; overflow-x: scroll; display:block;"/>

是正確的方法。 W3說約display:block;

在一個塊格式化上下文中，從一個包含塊的頂部開始，一個接一個地垂直佈置框，。 2個兄弟箱之間的垂直距離由「餘量」性質決定。格式化上下文摺疊塊中相鄰塊框之間的垂直邊距。

在塊格式化上下文中，每個框的左外邊緣觸摸包含塊的左邊緣（用於從右到左格式化，右邊的邊緣觸摸）。即使在漂浮物存在的情況下也是如此（儘管由於漂浮物，框的內容區域可能會縮小）。

這證明了爲什麼我的文本溢出需要作爲上下文值進行處理。

來源

2013-04-09 08:44:25

擺脫'！重要'。它們在'style'屬性裏沒有完全意義。它們僅用於外部CSS文件中的CSS樣式定義。他們的要點是防止'style'屬性中定義的CSS屬性覆蓋外部CSS文件中的樣式定義。 – BalusC 2013-04-09 11:19:58

@BalusC感謝您提供更多信息。其實我已經問過一個更深的問題，並且與這個問題相關[這裏]（http://stackoverflow.com/q/15901896/1659451）。這個問題是否需要關閉？ – 2013-04-09 12:30:28

JSF的outputText溢出

回答

相關問題