仅在 chrome 中内容不随 div 移动（asp 控件问题）

发布于 2024-12-25 13:04:47 字数 1502 浏览 0 评论 0原文

我有一个菜单 div 在 IE9 和 Firefox 中显示得很好，但在 chrome 和 IE8 中，当移动 div 时，div 的内容不会跟随实际的 div 本身：

IE9/FF：在此处输入图像描述

Chrome：在此处输入图像描述

据我所知，我没有任何 css 冲突或流程问题。但我可能错过了一些东西（显然）。任何帮助将不胜感激。 TIA

这是当前的 div 层次结构：

<div id="mainBody">
     <div id="mainMenu" class="mainMenu">
          <asp:Menu class="menuItems">
               <--- menu items jargon here --->
          </asp:Menu>
     </div>
</div>

和 css：

body
{
    background-color: #E7EDEB;
}

.textBox
{
    margin: 1px;
}
#mainBody
{
    border: 1px solid #000000;
    width: 1000px;
    background-color: #FFFFFF;
    margin-left: 10%;
    margin-right: 10%;
    padding: 0px;
    font-family: Calibri;
    letter-spacing: .03em;
}
.mainMenu
{
    border: 1px solid #000000;
    background-color: White;
    margin: 0px;
    position: relative;
    width: 600px;
    left: 50px;
    bottom: 25px;
    height: 30px;
}
.MenuItems
{
    vertical-align: middle;
    font-family: Calibri;
    font-size: large;
    text-decoration: none;
    text-align: left;
    color: #000000;
    margin: 3px;
}
div#mainContent
{
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    margin: 0px;
    width: 1000px
}

更新：我从 div 中删除了 asp 菜单控件，并将其替换为纯文本。它看起来更像你所期望的，所以它让我相信它与控件本身有关。我还没有对控件本身应用任何样式，所以我仍然迷失方向。

原文

I have a menu div that appears just fine in IE9 and Firefox, but in chrome and IE8, the contents of the div are not following actual div itself when the div is moved:

IE9/FF:
enter image description here

Chrome:
enter image description here

As far as I can tell, i don't have any css conflicts or issues with flow. I may be missing something though (obviously). Any help would be greatly appreciated. TIA

Here is the current div hiearchy:

<div id="mainBody">
     <div id="mainMenu" class="mainMenu">
          <asp:Menu class="menuItems">
               <--- menu items jargon here --->
          </asp:Menu>
     </div>
</div>

And the css:

body
{
    background-color: #E7EDEB;
}

.textBox
{
    margin: 1px;
}
#mainBody
{
    border: 1px solid #000000;
    width: 1000px;
    background-color: #FFFFFF;
    margin-left: 10%;
    margin-right: 10%;
    padding: 0px;
    font-family: Calibri;
    letter-spacing: .03em;
}
.mainMenu
{
    border: 1px solid #000000;
    background-color: White;
    margin: 0px;
    position: relative;
    width: 600px;
    left: 50px;
    bottom: 25px;
    height: 30px;
}
.MenuItems
{
    vertical-align: middle;
    font-family: Calibri;
    font-size: large;
    text-decoration: none;
    text-align: left;
    color: #000000;
    margin: 3px;
}
div#mainContent
{
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    margin: 0px;
    width: 1000px
}

UPDATE:
I removed the asp menu control from the div and replaced it with plain text. It looked much more like you would expect, so it's leading me to believe it has something to do with the control itself. I haven't applied any styles to the control itself so im still lost.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

拥抱没勇气 2025-01-01 13:04:47

尝试向您的跳过链接添加样式：

#ctl04_SkipLink {
position:absolute;
left:-9999px;
}

Try adding styling to your skiplink:

#ctl04_SkipLink {
position:absolute;
left:-9999px;
}

回复收藏 0 原文

本宫微胖 2025-01-01 13:04:47

这是由您在 ul 之前隐藏的锚点引起的。还没弄清楚为什么。

编辑：实际上，它似乎是您在该锚点内隐藏的图像。

回复收藏 0 原文

信仰 2025-01-01 13:04:47

作为一个 ASP 控制问题，我想我永远也搞不明白。事实证明，这是 ASP 呈现控件的方式的问题。感谢 Rob，我们能够将范围缩小到 SkipLink。由于该页面是个人的，因此我不需要担心跳过链接，因此我选择完全禁用它。在 ASP 中执行此操作的方法只需在菜单控件中将 SkipLinkText 设置为“”即可。

对于遇到此问题的其他人，这里显示了一些其他技巧：

http:// forums.asp.net/t/976796.aspx/1

谢谢大家

回复收藏 0 原文