Joseph Duffy
Joseph Duffy

Reputation: 4836

Webkit CSS Reset?

I know there's a few CSS Reset tools out there, Eric's and Yahoo's to name 2.
However, when I'm using certain tags (I think they're called tags?) such as "li" and "ul", I get some extras in the User Agent Stylesheet. Some of these are:

-webkit-margin-before: 1em;  
-webkit-margin-after: 1em;  
-webkit-margin-start: 0px;  
-webkit-margin-end: 0px;  
-webkit-padding-start: 40px;  

I'm wondering if there's a reset stylesheet out there that deals -webkit etc?
I have searched for one, but with now luck.

Upvotes: 32

Views: 22037

Answers (5)

tony gil
tony gil

Reputation: 9564

If user agent stylesheet is being called, it is because the property that is called for / needed was not properly defined in your css stylesheet.

Error check your CSS using a tool like CSS Lint and fix any problems that might be detected before trying workarounds.

Upvotes: 0

Andrew Moore
Andrew Moore

Reputation: 95424

While these styles are applied by Webkit, they are over-ruled by margin: 0; padding: 0; located in the CSS resets. You don't have to worry about them.

Note: Although Chrome (Version 27.0.1453.116 m) Developer Tools does not display the user agent styles with strikethrough, the computed styles do reflect that explicit margin and padding values override.

Upvotes: 14

story
story

Reputation: 749

I was having this same problem with my <h3> tag. I tried setting margin:0;, but it didn't work.

I found that I was habitually commenting out lines in my css by using //. I never noticed it because it hadn't caused any problems before. But when I used // in the line before declaring <h3>, it caused the browser to skip the declaration completely. When I traded out // for /**/ I was able to adjust the margin.

Moral of this story: Always use proper commenting syntax!

Upvotes: -1

bastien
bastien

Reputation: 209

I had the same problem with li and ul, and found the following solution: in my CSS, I had an attribute for the li of my list which was display: inline. I replaced it with float: left and it works. I don't know why...

Upvotes: 1

PavlosVos
PavlosVos

Reputation: 212

Acctually if you are working with <ul> in your markup the reset margin: 0, padding: 0; do not overwrite the -webkit-padding-start: 40px;

I solved the problem by adding to my reset file a

ul {
    -webkit-padding-start: 0px;
}

Upvotes: 13

Related Questions