2

我有一个 div,我在其中显示一些文本,并且 div 具有固定的高度和宽度,并且溢出隐藏。但它在 firefox、chrome 和 safari 中显示不同的文本。在 chrome 和 safari 中,可以看到一行额外的文本。如果我删除:

-moz-column-count:2;
-webkit-column-count:2; 

财产然后它的工作正常。但是如果添加这个属性,它会在 Firefox 和 chrome 中显示不同的文本。

我正在附加 chrome 和 firefox 的快照。

   <div style=" width: 710px; height: 70px;position:absolute;overflow:hidden;top=0;left=0;-moz-column-count:2;-webkit-column-count:2;z-index:102;">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
        <p> Vivamus mattis laoreet velit quis malesuada. Quisque tincidunt elit sit amet nibh volutpat id pretium nisl consequat. Quisque dictum lacus at mauris scelerisque auctor. Nulla adipiscing, sapien sit amet </p>

    </div>

铬视图 在此处输入图像描述

火狐视图 在此处输入图像描述

4

1 回答 1

0

您应该从该 DIV 中删除您的高度或宽度标签。进一步的 P 元素需要一些样式来将它们显示为列。

<style type="text/css">
div {
    width: 710px; 
    position:absolute;
    overflow:hidden;
    top=0;
    left=0;
    -moz-column-count:2;
    -webkit-column-count:2;
    z-index:102;
}
p {
    overflow: hidden;
    float:left;
}
</style>  
<div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p> Vivamus mattis laoreet velit quis malesuada. Quisque tincidunt elit sit amet nibh volutpat id pretium nisl consequat. Quisque dictum lacus at mauris scelerisque auctor. Nulla adipiscing, sapien sit amet </p>

</div>
于 2013-05-09T07:20:16.703 回答