页面布局搞砸了答案

【问题标题】：Page layout got messed up页面布局搞砸了
【发布时间】：2012-06-23 19:19:43
【问题描述】：

我有很多使用完全相同的 html 结构的网页。

由于某种原因，page 的宽度被弄乱了。这就是布局应该看起来像 http://bit.ly/Ie7yZ4 。

这些页面上唯一的区别是文本内容来自 MySQL 数据库。

我认为问题与页面上的前几段有关，但我无法弄清楚它是什么。

PS：请，如果您不知道如何解决问题，但又想教我有关无表格布局和 div 的知识，请省着气 - 我有理由选择表格和所有页面在 google 中排名很高，加载速度快且易于维护。

【问题讨论】：

“易于维护” - 嗯...

标签： mysql html css

【解决方案1】：

原因在页面底部的Search tags 部分。没有任何空格的长文本会拉伸表格单元格。

添加空格或作为选项添加到span标签样式属性

width: 600px;
display: block;
word-wrap: break-word;

【讨论】：

这是一个非常优雅优雅的 css 解决方案，我会相信你的答案，但 mazzucci 是第一个指出问题的人。我将不得不添加空格，因为这样会使它看起来像一个文本块

【解决方案2】：

这是因为搜索标签很长。

你可以用一点 css 来改变它：

width: 615px;
display: block;
word-wrap: break-word;

将其添加到包含标签的跨度中，您应该会很好。这将标签包装在容器内。

当然也可以在每个逗号后加空格。

【讨论】：

【解决方案3】：

最后一个跨度“搜索标签”有几个很长的句子，没有任何空格。这些线强制布局宽度。例如： 08601,08602,08603,08604,08605,08606,08607,08608,08609,08610,08611,08618,08619,08620,08625,08628,08629,08638,08641,08645,08646,08647,08648,08650,08666,08690,08691,08695,

我建议在这些单词之间添加空格，以便它可以显示在多行上，或者将它们放在具有最大宽度的滚动容器中。

【讨论】：

啊，你是我的英雄！由于某种原因，在我最后一次执行 mysql 导出/导入后，它删除了逗号后的所有空格。

【解决方案4】：

这是您在包含<p> 的那个段落上得到的那个长得可怕的alt标签：

alt="Mold Testing Trenton, Mercer County NJ New Jersey08601 ,08602,08603,08604,08605,08606,08607,08608,08609,08610,08611,08618,08619,08620,08625,08628,08629,0863 08641,08645,08646,08647,08648,08650,08666,08690,08691,08695,"

删除修复段落。

【讨论】：

【解决方案5】：

如果你真的需要它们（我个人会使用display: none，或者完全删除它们），那么你需要将table-layout: fixed; 应用于表，并将word-wrap: break-word; 应用于跨度。

【讨论】：