最大宽度和 IE答案

【问题标题】：Max-width and IE最大宽度和 IE
【发布时间】：2014-02-22 19:30:21
【问题描述】：

我担心这是一个愚蠢的新手问题，但我没有找到任何关于它的信息（在这里或其他地方）：如何为IE 实现最大宽度指令？当 max-width 应用于图片时，我已经广泛阅读了有关错误的信息，但令我绝望的是，对纯文本一无所知。在我的样式表中，我有：

P {max-width: 600px}

和Firefox 和Chrome 适当地将文本行的长度限制为600px，但IE（第8 到10 节）没有。（我在不同的计算机上验证了这一点。）我究竟做错了什么？ IE中的段落不能应用max-width吗？

【问题讨论】：

你说的代码在哪里？展示一个重复问题的简洁示例。您是否尝试过添加width？
最好你阅读这个链接..msdn.microsoft.com/en-us/library/ie/ms530811(v=vs.85).aspx

标签： css internet-explorer stylesheet

【解决方案1】：

怎么样：

p.paragraph {
    display: block;         /* just to be sure - it's not needed */ 
    max-width: 600px;       /* for most modern browsers (not IE < 8) */
    width: auto !important; /* IE max-width hack */
    width: 600px;           /* width value for IE */
}

【讨论】：

【解决方案2】：

您可能会惊讶地发现 max-width 确实有效。如果你使用 F12 开发者工具，并选择元素，你会看到它确实是 600px（假设你用大于 600px 的东西填充它）。

问题很可能是您的内容溢出了元素。如果你想让它剪辑，那么你应该设置overflow:hidden，或者也许overflow:auto 来查看滚动条。

看这个小提琴：

http://jsfiddle.net/nSJw9/

你也可以设置word-wrap:break-word，如果你想让它包裹牢不可破的文本，虽然从技术上讲 css3 把名字改成了 overflow-wrap，但是 word-wrap 被认为是一个“替代名称”，因为它已经被支持了这么久。

http://jsfiddle.net/XuF33/1/

仅供参考，Chrome 在这里与 IE 做的事情完全一样，所以我不确定你为什么声称它适用于 Chrome 而不是 IE。也许你需要包含你的 HTML

【讨论】：

【解决方案3】：

为段落本身设置宽度可能不是最佳做法，请在其周围放置一个 div。据说IE 8不支持max-width，只要没有设置初始宽度。

【讨论】：

在p 上设置width 并将其包含在div 中没有任何错误（或不良做法）。