Ошибка меню Chrome, по умолчанию asp страница

Я использую созданную по умолчанию страницу asp в visual studio. (Я немного изменил код CSS, но ошибка была с самого начала). Проблема в том, что меню всегда немного под положением, которое оно должно быть, и я не могу его переместить с помощью таких значений, как up и padding.Ошибка меню Chrome, по умолчанию asp страница

Файл CSS.

/* DEFAULTS 
----------------------------------------------------------*/ 

body 
{ 
    background: #999966; 
    font-size: .80em; 
    font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    margin: 0px; 
    padding: 0px; 
    color: #696969; 
} 

a:link, a:visited 
{ 
    color: #034af3; 
} 

a:hover 
{ 
    color: #1d60ff; 
    text-decoration: none; 
} 

a:active 
{ 
    color: #034af3; 
} 

p 
{ 
    margin-bottom: 28px; 
    line-height: 1.6em; 
    height: auto; 
    width: 926px; 
} 
/* PRIMARY LAYOUT ELEMENTS 
----------------------------------------------------------*/ 

.page 
{ 
    width: 90%; 
    background-color: #fff; 
    margin: 20px auto 0px auto; 
    border: 1px solid #496077; 
} 

.header 
{ 
    position: relative; 
    margin: 0px; 
    padding: 0px; 
    background: #009900; 
    width: 100%; 
    top: 0px; 
    left: 0px; 
    height: 101px; 
    border-bottom-left-radius:20px; 
    border-bottom-right-radius:20px; 
} 

.header h1 
{ 
    border-style: none; 
    border-color: inherit; 
    border-width: medium; 
    font-weight: 700; 
    padding: 0px 0px 0px 20px; 
    color: #2c2cb0; 
    line-height: 2em; 
    font-size: 2em; 
    width: 938px; 
    height: 70px; 
    margin-left: 0px; 
    margin-right: 0px; 
    margin-top: 0px; 
} 

.main 
{ 
    padding: 0px 12px; 
    margin: 12px 8px 8px 8px; 
    min-height: 420px; 
} 

.leftCol 
{ 
    padding: 6px 0px; 
    margin: 12px 8px 8px 8px; 
    width: 200px; 
    min-height: 200px; 
} 
.RightCol 
{ 
    padding: 6px 0px; 
    margin: 12px 8px 8px 810px; 
    width: 150px; 
    min-height: 200px; 
    position: relative; 
} 

.footer 
{ 
    color: #4e5766; 
    padding: 8px 0px 0px 0px; 
    margin: 0px auto; 
    text-align: center; 
    line-height: normal; 
    background: #ffffff; 
} 


/* TAB MENU 
----------------------------------------------------------*/ 

div.hideSkiplink 
{ 
    background-color:#000000; 
    width:100%; 
    height: 32px; 
    border-bottom-left-radius:20px; 
    border-bottom-right-radius:20px; 
} 

div.menu 
{ 
    padding: 4px 0px 4px 8px; 
} 

div.menu ul 
{ 
    list-style: none; 
    margin: 0px; 
    padding: 0px; 
    width: auto; 
} 

div.menu ul li a, div.menu ul li a:visited 
{ 
    background-color: #000000; 
    color: #fafbba; 
    display: block; 
    line-height: 1.35em; 
    padding: 4px 20px; 
    text-decoration: none; 
    white-space: nowrap; 
} 

div.menu ul li a:hover 
{ 
    background-color: #bfcbd6; 
    color: #465c71; 
    text-decoration: none; 
} 

div.menu ul li a:active 
{ 
    color: #cfdbe6; 
    text-decoration: none; 
} 
div ul:last-child li:last-child a:last-child 
{ 
    border-bottom-left-radius:10px; 
    border-bottom-right-radius:10px; 
}

Site.Master

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="SiteMaster"%> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head id="Head1" runat="server"> 
    <title>title> 
    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" /> 
    <link href="~/Styles/NormalText.css" rel="stylesheet" type="text/css" /> 
    <asp:ContentPlaceHolder ID="HeadContent" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body> 
    <form id="Form1" runat="server"> 
    <div class="page"> 
     <div class="header"> 
      <div class="title"> 
       <h1 style="text-align:left; font-size: 40px;"></h1> 
      </div> 
      <div class="clear hideSkiplink"> 
       <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" 
        EnableViewState="False" IncludeStyleBlock="False" Orientation="Horizontal" 
        onmenuitemclick="NavigationMenu_MenuItemClick"> 
        <Items> 
         <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Selelox" Value="Selelox"/> 
         <asp:MenuItem NavigateUrl="~/Programs.aspx" Text="Programs" ToolTip="You will find all programs here"/> 
         <asp:MenuItem Text="Profile" Value="Profile"> 
          <asp:MenuItem NavigateUrl="~/Account/Login.aspx" Text="Login" Value="Login"> 
          </asp:MenuItem> 
          <asp:MenuItem NavigateUrl="~/Account/Register.aspx" Text="Register" 
           Value="Register"></asp:MenuItem> 
         </asp:MenuItem> 
         <asp:MenuItem Text="Help" Value="Help"> 
          <asp:MenuItem NavigateUrl="~/FAQ.aspx" Text="FAQ" Value="FAQ"></asp:MenuItem> 
          <asp:MenuItem NavigateUrl="~/ReportProblems.aspx" Text="Report problem" 
           Value="Report problem"></asp:MenuItem> 
          </asp:MenuItem> 
         </asp:MenuItem> 
         <asp:MenuItem NavigateUrl="~/Community/Forum.aspx" Text="Forum" ToolTip="Forum"/> 
        </Items> 
        <StaticItemTemplate> 
         <%# Eval("Text") %> 
        </StaticItemTemplate> 
       </asp:Menu> 
      </div> 
     </div> 
     <div class="main"> 
      <asp:ContentPlaceHolder ID="MainContent" runat="server"> 
      </asp:ContentPlaceHolder> 
     </div> 
     <div class="clear"><div class=""> 
     </div> 
    </div> 
    </div> 
    </form> 
</body> 
</html>

источник

2012-01-25 Frozendragon

Если меню жерех оказывает как DIV (не уверен), это может работать: не

div.menu 
{ 
... 
    margin-top: -3px; 
}

источник

2012-01-25 15:11:43

Это похоже на работу. Спасибо, как я теперь загружаю это, только если человек использует хром. – Frozendragon

См. [Link] (http://stackoverflow.com/questions/4401957/detect-chrome-browser-in-html). Однако вы должны решить это без таких методов. Какие браузеры вы успешно протестировали? –

Я не могу видеть в вашем CSS, как вы, содержащий ваше меню, но вы можете попробовать clearfix, чтобы увидеть, если он устраняет проблему. Попробуйте это:

.menu:before, .menu:after { 
display:table; 
content:""; 
zoom:1; /* IE fix */ 
} 

.menu:after { 
clear:both; 
}

источник

2012-01-25 15:09:28

Ни одно из исправлений, которые я нашел где-нибудь работал для меня, так что я использовал этот Chrome хак:

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    div.menu ul { top: -21px; } 
    div.menu { height: 20px; } 
}

Заимствованные хак от reflexiv на своем посту here.

Индивидуальный пробег может отличаться.

источник

2013-02-04 18:00:18 Taersious

Ошибка меню Chrome, по умолчанию asp страница

ответ

Смежные вопросы