php - word-wrap 属性似乎在 CSS 中不起作用

Question

我设计了一个 html iframe，我想在其中使用 word-wrap 属性，即，它应该将长单词分到下一行。但相反的是，对于长词，它会添加一个水平滚动条，而不是将单词分到下一行。

我尝试使用“溢出：隐藏”属性隐藏滚动条，但没有任何反应。

我可以在这里使用一些帮助。

这是 iframe 的 html 代码：

<div id="main_frame" >
<iframe id="main_frame" src="homedept.php" name="iframe_a"></iframe>
</div>

CSS是：

div#main_frame
{
 float: left;
margin-top:198px;
margin-left:5px;
float:left;
position:relative;
width:100%;
height:900px;
z-index: 0;
word-wrap:break-word;
}

iframe#main_frame
{
float:left;
margin-left: 30px;
margin-right: 300px;
float:left;
border:none;
word-wrap:break-word;
width: 78%;
height:70%;
z-index: 1;

}

感谢@tyriar 的回复，我现在已将自动换行属性设置为原始页面。仍然没有任何反应。

<div id="display_posts">


<?php //php echoes some text here ?>

</div>

CSS代码是：

#display_posts
{
word-wrap:break-word;
}

Answer 1

您定义相同ID 2 times，但ID必须是unique，您不能声明它两次。

所以使用class而不是使用ID

还iframe调用其他页面并且您word-wrap在原始页面中定义，因此它不适用。

Answer 2

您不能应用于word-wrap，iframe它是一个完全独立的页面，并且与原始页面的样式不适用。您需要更改iframe指向的页面上的样式。

此外id，属性必须是唯一的，您已id="main_frame"在 aniframe和 a上设置div。

更新

如果word-wrap:break-all是，iframe那么可能页面的宽度正在引入滚动条。确保您的元素随页面正确缩小。如果您iframe在浏览器中加载页面，您应该能够减小窗口大小而不会出现水平滚动条。如果是这样，那么这是该页面的最小宽度的问题。

Answer 3

尝试

word-break:break-word

或者

word-break:break-all

并尝试使用类而不是 ID，因为 ID 应该是唯一的。