鱼摆摆平时接一点切图优化淘宝代码的小单子，最近发现淘宝旺铺2012存在一个小bug：如果卖家不喜欢淘宝自带的导航条，而把店招设置成150px，来隐藏导航条后，使用自己设计的淘宝自定义店铺招牌。就会在行与行之间产生4px的间隙。而这个间隙在ie6下不会显示，但是在ie7、ie8和谷歌浏览器上就会显示出来。看上去感觉模板塌陷了。如下图：

该店招设计成了3行，看上去明显感觉模板被撑破了。经过反复测试，发现在ie7、ie8和谷歌浏览器下，行与行之间会自动生成一个4px的间隙(该间隙透明，会显示页头背景)，原有150px的店招就会变形，导致模板被撑破。

做了很多尝试，如果通过css设置表格的margin、padding为0，加大切片的高度等措施都没有效果。最后，决定牺牲ie6，兼容ie7、8和谷歌浏览器，其解决办法就是考虑到行与行之间的4px像素，修改原有设计稿，将第二行菜单栏上下各加大4px的黑色背景，然后切图制作代码时，将加大的上下4px区域删除掉。并设置第一行垂直顶部对齐，第二行垂直居中对齐，第三行垂直底部对齐，才解决了问题。

其效果如下：

该bug已经向淘宝提交了，希望能够尽快修复。如果其他朋友也遇到这个问题，不妨按我的办法尝试一下。如果您还有更好的办法，欢迎我们一起交流。