User agent styles overrides custom CSS

• Component: CSS
• Status: RESOLVED WORKSFORME

I have an unsorted list in a fixed position header and it seems impossible to override the user agent style. Here's the CSS:

#header {
	position: fixed;
}

#header #nav {
	position: relative;
}

#header #nav ul {
	width: 100%;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

The last CSS rules should override the user agent styles, but they don't.

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

That's the user agent style. It all remains active and my navigation doesn't display properly, because of the padding.

[Tim Nguyen (:ntim)]

I can't reproduce this anymore:

data:text/html,<ul style="padding:0;"><li>hi</li><li>foo</li></ul>

renders differently from:

data:text/html,<ul><li>hi</li><li>foo</li></ul>