/    Sign up×
Community /Pin to ProfileBookmark

Why does IE display all margins and paddings larger than other browsers?

Copy linkTweet thisAlerts:
Aug 31.2010

If I had div{margin-top:100px;}, it would be further from the top in IE than in any other browsers. Are there any workarounds?

to post a comment
CSS

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@tracknutAug 31.2010 — Any chance that div is inside another block where you haven't set the margins? Default margins and padding are not the same in all browsers, so you either need to explicitly set them to something, or make a global setting like:
<i>
</i>* {margin:0;padding:0}


Dave
Copy linkTweet thisAlerts:
@narutodude000authorAug 31.2010 — Yes, I have that.

For example, #login input[type="submit"]{padding:0 5px;} barely makes a difference in Chrome/FF but it makes the button look big and fat in IE.
Copy linkTweet thisAlerts:
@tracknutSep 01.2010 — Are you talking about page margins or button sizes? Do you have an example I could see?

Dave
Copy linkTweet thisAlerts:
@WestWebSep 01.2010 — Have you tried this at the beginning of your stylesheet to reset margins and padding?
[CODE]
* {
margin: 0px;
padding: 0px;
}
[/CODE]

If so, what about trying something like Eric Meyers reset stylesheet, which should almost eliminate cross browser css issues.

To answer your question in the title: IE treats the CSS Box model differently than other browsers by default. Such a PITA sometimes. :rolleyes:
×

Success!

Help @narutodude000 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...