为什么我的文本在IE7和Firefox左侧被切断了?

时间:2009-12-24 09:05:03

标签: css xhtml

为什么我的文字会在左侧的IE7和Firefox中被切断?只有当我添加padding-left:1px时,它看起来还不错?为什么会这样?我不能给网站的实时链接。

在此屏幕截图alt text http://easycaptures.com/fs/uploaded/458/3132736693.png

中查看问题

字母“W”从左侧切断。

CSS代码

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, em, font, img, ins, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td 
{
border:0 none;
font-size:100%;
margin:0;
padding:0;
vertical-align:baseline;}

body {font-family:Arial,Helvetica,sans-serif;
font-size:62.5%;
line-height:1.2;}

ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;}

.home-boxesContainer ul {
font-size:0.9em;
margin:auto;
overflow:hidden;
width:90%;}

.home-boxesContainer ul li {
background:transparent url(Images/dot-grey.gif) repeat-x scroll left bottom;
float:left;
line-height:16px;
margin:10px 0 0;
overflow:hidden;
padding-bottom:5px;
padding-right:10px;}

.home-boxesContainer ul li a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(Images/arrow-green.gif) no-repeat scroll right center;
color:#6CB025;
padding-right:20px;
text-decoration:none
}

3 个答案:

答案 0 :(得分:3)

根据我的经验,这是Windows上某些字体的问题,特别是Verdana。三年前,我花了大约三天时间寻找漂浮物,以解决这个问题。它主要发生在大写'w'字符上,但也可能是'v'的问题,只有禁用了cleartype。

如果您认为需要实施修复,最佳解决方案是在段落上使用text-indent:1px;

答案 1 :(得分:0)

我看不到您的屏幕截图,但我认为它的字体问题,尝试使用不同的字体。

答案 2 :(得分:0)

我怀疑有三个原因:

  1. 将菜单的容器推到那里,然后左右制作文字
  2. 它也可能是字体问题(这有时会因字体而发生)
  3. 尝试在列表中添加行高。