CSS中不需要的填充

Question

http://www.milknhny.co.uk/

我遇到了一个似乎无法找到的 CSS 问题，这肯定不在我的 style.css 中，我不知道这是从哪里来的。

我正在尝试为我的菜单设置样式，但总体而言这给我造成了严重破坏。

它正在创建的 css 如下：

ul, menu, dir {
display: block;
list-style-type: disc;
-webkit-margin-before: 1.1em;
-webkit-margin-after: 0em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
}

我被告知这是谷歌自己的风格，它超越了我自己的风格。

现在我已将此添加到我自己的 CSS 中，并将 40 像素覆盖为 0 像素！在填充开始时很重要。但是我希望避免这种情况。

任何人都可以提供有关如何解决的建议吗？因为这是在我的菜单上创建一个大的左侧填充（请参阅网站）

请忽略菜单的位置，因为在我解决此问题之前，它还没有完全设置样式

Answer 1

我刚刚明白了。除了您在#agent li CSS 部分中提到的填充值之外，用户代理样式表还给出了填充值。我只是对删除 chrome DOM 检查器中的 CSS 感兴趣，并且网站对我来说看起来不错

Answer 2

只会和 ashutosh 说同样的话。如果您指定 UL 具有零填充应该可以正常工作。我认为应该尽可能避免使用 !important 和内联 CSS。

Answer 3

根据here 的规定，您可以使用!important 标签。

另一种选择是在受影响的项目上使用内联 css：

<div id="menuwrapper">
<div id="menuwrapperinner">
<div id="access">
<div class="menu">
   <ul style="padding: 0;"  >
   <!-- or 
   <ul style="-webkit-padding-start: 0;" > -->
       <!-- your <li></li> items here -->
   </ul>

（您可能想尝试使用 Chrome 开发工具）

PS：使用 wordpress 的主题或查看 Bootstrap 来实现自己的菜单。