Как лучше всего переопределить правило таблицы стилей CSS пользовательского агента, которое дает неупорядоченным спискам поле 1em?

Я работаю над веб-приложением, у которого есть topBar, похожий на синюю панель facebook на Топ. У меня есть неупорядоченный список в div этой панели, в котором перечислены некоторые элементы, такие как «Входящие», «Уведомления» и т. Д. UL имеет поле 1em, как определено таблицей стилей пользовательского агента моего браузера. Это проблема, потому что мой topBar опускается на 1em. Как я могу переопределить это, чтобы граница ul = 0? Я читал, что переопределение таблиц стилей пользовательского агента - плохая идея, поэтому мне любопытно узнать, что лучше всего делать. Спасибо.

РЕДАКТИРОВАТЬ: Вот файл CSS:

body {

margin:0px;
padding:0px;
}

#topBar{
    background-color:#CCCCCC;
    height: 50px;
    width:100%;
    z-index:-1;

}

#mainNav{
    margin:0 auto;
    width:900px;
}
#logo{
    float:left;
}

#mainNav ul li{
    float:left;
    border:0px; 
    margin:0;
    padding:0;
    font-size:10px
}

И html:

<!DOCTYPE html>
<html>
    <head>
        <title>ff</title>
        <%= stylesheet_link_tag :all %>
        <%= javascript_include_tag :defaults %>
        <%= csrf_meta_tag %>
    </head>
    <body>
        <div id="topBar">
            <div id="mainNav">
                <div id="logo"><%=image_tag("livecove.jpg") %></div>
                <ul>
                    <li>Inbox</li>
                </ul>
            </div>
        </div>

        <%= yield %>
    </body>
</html>
20
задан John 27 March 2011 в 01:41
поделиться