关于谷歌自动换行的奇异效果

首先贴上代码：

View Code 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>ggggg</title>
<style typ="text/css">
  *{margin:0;padding:0;}
  p{width:112px;line-height:18px;font-size:14px;border:1px solid #ddd;font-family:'宋体';}
  p .a{font-size:12px;}
  i{font-style:normal;}
</style>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
</script>
</head>
<body>
  <p><i>qq音乐</i><i class="a">(3.2.0.2561)</i></p>
</body>
</html>

效果图如下：

在谷歌下，自动的换行后的效果十分难看，预期效果应该是IE中的，又小测了一下，只要P标签下的子元素的宽度在107-114之间都是这个效果，解决方案是给第一个I标签后添加一个空格，谷歌效果就会渲染的一样，不清楚是什么原因造成的，留待以后解决！

posted @ 2013-04-19 17:18  独角xi  阅读(674)  评论(2)  编辑  收藏  举报