Firefox specific margin?

Question

How can I set a specific margin for Firefox in CSS? I tried -moz-margin:0px;

My problem is in every browser, even IE works,

but firefox fails at my CSS now... There are certain links that move like 1px to the left when I rollover them...

Can you provide an example page? I've not had this issue on any of the new versions of Firefox. — Karl Nicoll, Jul 18 '11 at 17:59
It's a local instance - but it the links do have a padding of 5px; around them, and margin of 6px;... — Matt, Jul 18 '11 at 18:00
If they move 1px to the left when you rollover them make sure the :hover css selectors are the same as the non hover. Also open up firebug and rollover them and see what changes. — Steven, Jul 18 '11 at 18:01
I actually just fixed it - :) There was something using em as measurement and FF fails at Em.. — Matt, Jul 18 '11 at 18:02
@Matt, if you are able to add code examples to your question, and your own answer for the fix, then this question would be useful to other folks. — KatieK, Jul 18 '11 at 18:05

score 78 · Accepted Answer · answered Jul 18 '11 at 18:04

78

Your problem probably lies elsewhere, but here's how you target Firefox only:

@-moz-document url-prefix() {
    a {
        margin: 0;
    }
}

answered Jul 18 '11 at 18:04

wanovak

score 20 · Answer 2 · answered Jul 18 '11 at 18:06

20

You can try something like this:

@-moz-document url-prefix() { //Your css here }

That will only be read by Firefox.

answered Jul 18 '11 at 18:06

Soatl

score 9 · Answer 3 · answered Jul 18 '11 at 18:08

9

To directly answer your question:

.myElement, x:-moz-any-link, x:default {
    margin: 0px;
}

This will set all elements with the 'myElement' class to a 0px margin within firefox only.

answered Jul 18 '11 at 18:08

Aedaeum

3 Answers3