Странные дополнительные отступы в Chrome с использованием стандартного шаблона VS 2010

У меня есть следующий код, слегка измененный по сравнению с шаблоном css Visual Studio 2010. Моя проблема в том, что я получаю дополнительные верхние отступы / поля примерно в 10 пикселей в родительском элементе управления меню только в Chrome. В IE все нормально. Что здесь происходит?

CSS

    /* CSS RESET 
----------------------------------------------------------*/
*{margin:0;padding:0;}


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

body   
{
    background: #b6b7bc;
    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: 10px;
    line-height: 1.6em;
}


/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6
{
    font-size: 1.5em;
    color: #666666;
    /*font-variant: small-caps;*/
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

h1
{
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2
{
    font-size: 1.5em;
    font-weight: 600;
}

h3
{
    font-size: 1.2em;
}

h4
{
    font-size: 1.1em;
}

h5, h6
{
    font-size: 1em;
}

/* this rule styles 

and

tags that are the first child of the left and right table columns */ .rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2 { margin-top: 0px; } /* PRIMARY LAYOUT ELEMENTS ----------------------------------------------------------*/ .page { width: 960px; background-color: #fff; margin: 20px auto 0px auto; border: 1px solid #496077; } .header { position: relative; margin: 0px; padding: 0px; background: #4b6c9e; width: 100%; } .header h1 { font-weight: 700; margin: 0px; padding: 0px 0px 0px 20px; color: #f9f9f9; border: none; line-height: 2em; font-size: 2em; } .main { min-height: 420px; } .mainContent { float:left; width:790px; padding-left:8px; } .leftCol { padding: 6px 0px; margin: 12px 8px 8px 8px; width: 200px; min-height: 200px; } .footer { color: #4e5766; padding: 8px 0px 0px 0px; margin: 0px auto; text-align: center; line-height: normal; } /* TAB MENU ----------------------------------------------------------*/ div.hideSkiplink { } div.topMenuContainer { background-color:#3a4f63; width:100%; } div.menu { padding: 0px 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: #465c71; border: 1px #4e667d solid; color: #dde4ec; display: block; line-height: 1.35em; padding: 4px 20px; text-decoration: none; white-space: nowrap; margin:0px; } div.menu ul li a:hover { background-color: #bfcbd6; color: #465c71; text-decoration: none; margin:0px; } div.menu ul li a:active { background-color: #465c71; color: #cfdbe6; text-decoration: none; margin:0px; } /* LEFT MENU ----------------------------------------------------------*/ div.leftMenuContainer { background-color:#3a4f63; width:160px; float:left; min-height: 420px; } div.leftMenu { padding: 4px 0px 4px 8px; } div.leftMenu ul { list-style: none; margin: 0px; padding: 0px; width: auto; } div.leftMenu ul li a, div.leftMenu ul li a:visited { background-color: #465c71; border: 1px #4e667d solid; color: #dde4ec; display: block; line-height: 1.35em; padding: 4px 20px; text-decoration: none; white-space: nowrap; } div.leftMenu ul li a:hover { background-color: #bfcbd6; color: #465c71; text-decoration: none; } div.leftMenu ul li a:active { background-color: #465c71; color: #cfdbe6; text-decoration: none; } /* FORM ELEMENTS ----------------------------------------------------------*/ fieldset { margin: 1em 0px; padding: 1em; border: 1px solid #ccc; } fieldset p { margin: 2px 12px 10px 10px; } fieldset.login label, fieldset.register label, fieldset.changePassword label { display: block; } fieldset label.inline { display: inline; } legend { font-size: 1.1em; font-weight: 600; padding: 2px 4px 8px 4px; } input.textEntry { width: 320px; border: 1px solid #ccc; } input.passwordEntry { width: 320px; border: 1px solid #ccc; } div.accountInfo { width: 42%; } /* MISC ----------------------------------------------------------*/ .clear { clear: both; } .title { display: block; float: left; text-align: left; width: auto; } .loginDisplay { font-size: 1.1em; display: block; text-align: right; padding: 10px; color: White; } .loginDisplay a:link { color: white; } .loginDisplay a:visited { color: white; } .loginDisplay a:hover { color: white; } .failureNotification { font-size: 1.2em; color: Red; } .bold { font-weight: bold; } .submitButton { text-align: right; padding-right: 10px; }

ASPX

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




    
    
    
    


    

My Site

[ Log In ] Welcome ! [ ]

Вывод HTML по запросу ...







    MT Games LTD - Home







    

Теперь на jsfiddle http://jsfiddle.net/hhdTe/1/ хотя формат есть но облажался - проблема все еще существует. Запустите его в IE и Chrome, и вы я вижу дополнительное заполнение над меню

6
задан Rich Andrews 24 January 2011 в 12:46
поделиться