限制<div>的最大高度,尽管文本更长

时间:2019-04-25 16:18:00

标签: overflow netsuite bfo

我正在使用BFO报告库(嵌入在NetSuite ERP中)创建文档。 我有一个文本块,我想限制在两行之内,如果超出的话会截断,但是我似乎无法让overflow:hidden来实际执行任何操作。设置height会限制最小高度,但是如果文本较长,则会扩展包含内容而不是被截断。

这是我正在渲染的文档:

<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE pdf PUBLIC '-//big.faceless.org//report' 'report-1.1.dtd'>
<pdf>
    <body width="3in" height="1.25in" padding="0">
        <div font-family="sans-serif" font-size="14pt" width="3in" height="2em" border="1px solid green" overflow="hidden">
            <p margin="0">Short Name</p>
        </div>
        <pbr/>
        <div font-family="sans-serif" font-size="14pt" width="3in" height="2em" border="1px solid green" overflow="hidden">
            <p margin="0">This Is An Item With A Really Extremely Long Name That Doesn't Fit</p>
        </div>
    </body>
</pdf>

以及生成的PDF:

"Short Name" is in a box approximately twice as high as the text, but "Really Extremely Long Name" has pushed the containing box out further than it's supposed to.

1 个答案:

答案 0 :(得分:3)

根据their documentation,BFO overflow属性标记仅适用于绝对定位的元素:

  

如果一个块的位置绝对大于其父元素,那么如何处理“溢出”父元素块的内容。

似乎包含要控制的内容的元素必须绝对放置,但是overflow属性可以应用于父元素。因此,您可以将position="absolute"添加到<p>元素中以获得所需的效果:

<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE pdf PUBLIC '-//big.faceless.org//report' 'report-1.1.dtd'>
<pdf>
    <body width="3in" height="1.25in" padding="0">
        <div font-family="sans-serif" font-size="14pt" width="3in" height="2em" 
border="1px solid green" overflow="hidden">
            <p margin="0">Short Name</p>
        </div>
        <pbr/>
        <div font-family="sans-serif" font-size="14pt" width="3in" height="2em" border="1px solid green" overflow="hidden">
            <p position="absolute" margin="0">This Is An Item With A Really Extremely Long Name That Doesn't Fit</p>
        </div>
    </body>
</pdf>

enter image description here