代码高亮中white-space: pre的兼容性问题：如何解决代码片段在不同浏览器下的换行问题？

包裹的文本则不会出现此问题。这表明，当字符串被内联元素包裹时，white-space: pre的有效性受影响。其根本原因在于，white-space: pre强制保留所有空格和换行符，但无法控制内联元素内的文本换行。当文本过长时，浏览器为适应页面宽度而自动换行，导致white-space: pre失效。

解决方法是采用更强大的white-space属性值：white-space: pre-wrap。它允许必要时自动换行，同时保留空格和缩进。为确保跨浏览器兼容性，建议同时设置多个浏览器前缀：

pre {
  white-space: pre-wrap; /* CSS3 */
  white-space: -moz-pre-wrap; /* Mozilla */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* Internet Explorer 5.5+ */
  -moz-binding: url('./wordwrap.xml#wordwrap'); /* 老版Firefox */
}

此方法有效处理内联元素中文本过长导致的换行问题，保证代码片段在不同浏览器下格式一致。