Я работаю над веб-приложением, у которого есть 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>