asp.net - CSS破坏显示顺序

Question

我正在使用 VS2010、C# 开发我的 ASP.NET 网络应用程序，我正在使用 .js 文件在我的程序中显示一些小工具提示，还有一个 CSS 文件也应该在我的 ASPX 中使用文件以便正确显示此工具提示，但是当我使用此 CSS 时，我的所有页面(包括表格)都显示在页面左侧，而我已将它们对齐到页面中心，我不是专家CSS 文件，我该如何解决这个问题，这是我的 CSS 文件:

    * {margin:0; padding:0}
    body {font:12px/1.5 Tahoma, Arial, Helvetica, sans-serif; background:#FFF}
    #text {margin:50px auto; width:500px}
    .hotspot {color:#900; padding-bottom:1px; border-bottom:1px dotted #900; cursor:pointer}

    #tt {position:absolute; display:block; background:url(images/tt_left.gif) top left no-repeat}
    #tttop {display:block; height:5px; margin-left:5px; background:url(images/tt_top.gif) top right no-repeat; overflow:hidden}
    #ttcont {display:block; padding:2px 12px 3px 7px; margin-left:5px; background:#666; color:#FFF}
#ttbot {display:block; height:5px; margin-left:5px; background:url(images/tt_bottom.gif) top right no-repeat; overflow:hidden}

Answer 1

#tt 设置为 position: absolute。这可能是您出现问题的原因，因为您没有告诉它您想要的位置，所以我怀疑它默认位于左上角。

您使用什么 CSS 将事物居中对齐？您的 HTML 结构是什么？我假设 #tt 是您页面上的主要容器...

要真正找出您的 CSS 的哪一部分是错误的，最简单的方法是从您的 CSS 文件中删除每一行/属性并重新测试，直到定位停止消失。

此外，如果该 CSS 纯粹用于您的工具提示，那么您可能不应该使用 * 选择器。更具体的东西，如 .Tooltip * 将最大限度地减少来自外部的任何干扰。

一般来说，如果样式只适用于一个给定的内容，我会在该内容上使用一个类(或 id)作为每个选择器的前缀，以保证您不可能更改除此之外的任何内容。