代码之家  ›  专栏  ›  技术社区  ›  TigerTiger

如何使用CSS设置定位标记文本宽度?

  •  7
  • TigerTiger  · 技术社区  · 17 年前

    我有HTML和CSS,如下所示-

        .title {
            display: block; background-color: red;
        }
    
    <a href="#">
        <span class="title">Text</span>
    </a>
    

    我可以看到跨度跨越到可用宽度的100%(因为 display: block )像下面

    |----------------------------------------------------|
    | Text                                               |
    |----------------------------------------------------|
    

    在火狐中,我可以点击上面框中的任何地方,然后进入链接页面。但是,在IE(IE7)中,只有当我将鼠标悬停在“文本”文本上时,光标才会变成手形。

    我要做什么黑客才能使它在IE中工作(和在FF中一样)?

    我试着将锚标记本身(不仅仅是文本)放在SPAN中,但它不起作用。

    谢谢。

    6 回复  |  直到 10 年前
        1
  •  16
  •   Quentin    17 年前

    设置锚定样式并删除跨度。

    (问题在于某些浏览器如何处理 display: block 内部元素是 display: inline . 您可以通过设置锚点和跨度的样式来解决此问题,但在本例中,跨度似乎是多余的)

        2
  •  8
  •   Rik Heywood    17 年前

    为了你 <a> 标记,使样式“display:block;width:100%;”

        3
  •  0
  •   Alex Morales    17 年前

    当然,您需要删除跨度并将该类应用于锚标记。我不认为你需要明确地将宽度设置为100%,但我可能是错的。

        4
  •  0
  •   corymathews    17 年前

    删除多余的跨度,并将该标题类放在链接本身上。然后将宽度:100%添加到CSS中。

    标记越少越好,这就是您应该删除额外的范围的原因。

        5
  •  0
  •   dipen    16 年前

    也可以使用边距或填充

        6
  •  0
  •   tinlyx    10 年前

    给锚定一种风格 display:block max-width:30px !important; 最大宽度大小可以是任意

    li a {
        display: block;
        height: 30px;
        max-width: 30px !important;
    }