7C00.ME/houmu 2011-11-19

解决博客园模版错误排版的一个问题

昨天发现我的博客换了个模版之后,文章显示页面出现错误,就是侧边栏不在侧边显示,而是显示到了页面的下端。怎么看,怎么不爽,必要解决之。

首先以为是模版的问题,因为之前用的模版没有这个问题,于是换了几个模版,结果是对于像marvin2-blue这种布局简单(个人感觉)的少数模版可以正常访问,但是对于其他的绝大多数模版都会出现这个问题。接着怀疑是自己在博客设置里面使用了“通过CSS定制页面风格”等功能导致,但实际上把自己添加的CSS和HTML什么都删掉还是不行。然后就用Chrome的审查元素检查页面风格,把文章显示某些部分的html和css都看了看,自己试着改了些css代码,问题还是一样;再用Opera Inspect Element(个人感觉,Opera的Inspect Element做的要比Chrome好),想Chrome一样,改了些CSS,也没有取得特别大的进展。

这之间找了同一模版的其他文章显示页面都正常,陷入纠结之际,忽然想到了,除了在博客设置里面可以自定义CSS和HTML,还有个地方可以修改,那就是“博客签名”。果不其然,打开一看,当前设置的博客签名是自己写的HTML,一个“<div>”,但在最后没有闭合“</div>”,忘了个“/”。补上这个“/”,刷新页面,侧边栏显示位置就恢复正常了。至于为什么少个闭合“/”,感觉应该不会出现这么严重的问题,可能还是浏览器在解析DOM时容错还是有限。

反思一下这个问题,首先,在前端允许用户自定义HTML和CSS应该慎重,所以现在的论坛都是用discuz之类的代码,当然js更是不允许了。其次,对于“<div></div>”还是小心处理好,虽然现在浏览器对HTML标签有一定容错能力,但是毕竟还是有限的。