CSS中的负文本缩进的宽度问题

Question

CSS中的负文本缩进的宽度问题

Joh*_*ohn 5 css google-chrome text-indent

当我运行下面的代码时,我在屏幕上看到一个蓝色框.

<!DOCTYPE html>
<html dir="ltr">
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <style type="text/css">
                a {display:block;background:blue; text-indent:-9999px; float:left;}
        </style>
    </head>

    <body>
        <a>Hello World</a>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

为什么如果我改变了文本Hello World到HelloWorld,蓝框消失？

附加说明 - 我在谷歌浏览器中看到了这一点.

Answer 1

thi*_*dot 5

正如我在评论中所说,white-space: nowrap让它消失.

但是,我不确定这里到底发生了什么.Chrome/Safari + Opera的行为方式相同,显示"蓝框",而Firefox和IE7-9则不显示蓝框.

你的代码:http://jsbin.com/igewuy

随着white-space: nowrap"修复":http://jsbin.com/igewuy/2

归档时间：	14 年前
查看次数：	2445 次
最近记录：	14 年前