font-family: inherit; specific to mozilla firefox

Question

I have CSS to set my font-family to inherit like so:

font-family: inherit;

Is there a way to override this for Mozilla Firefox only? E.g. a specific attribute, like how I can write the following:

-moz-border-radius-bottomright: 20px;

which will be enabled/used on Mozilla browsers only?

@A.K I'm assuming he wants to know if there is an equivalent that is specific to firefox for font family, like how the radius property works. E.G. moz-font-family — Lloyd Powell, Jul 25 '12 at 08:20
@A.K. and Inkbug:i need a firefox specific attribute for font-family: inherit; — user1550884, Jul 25 '12 at 08:22

score 0 · Answer 1 · edited May 23 '17 at 11:55

0

There is no Firefox specific way to write font-family: inherit;. Mozilla support inherit like any other browser, if that is what you mean?

Vendor-prefixed properties (like those used for some CSS3 properties) are only used for properties that are still "experimental" or evolving. The inherit keyword has been around for ages and therefor Firefox, like any other browser, implement it the way the CSS-specification states, without a vendor prefix.

If you want to target only Firefox with some specific CSS, this SO answer states that you can wrap the Mozilla specific properties with a @-moz-document rule. As only Mozilla will recognize that as valid CSS, all other browsers will ignore it. A bit "hacky" perhaps, but it sounds like your best shot.

Edit:

To target only IE with specific CSS, one way is to put it in an IE-specific stylesheet file, and then use the conditional comments for IE. All browsers but IE will see this as an HTML-comment, and therefor ignore it, but IE will apply the styling in that file.

<!--[if IE]>
<link rel="stylesheet" href="ie.css" type="text/css" />
<![endif]-->

edited May 23 '17 at 11:55

Community

1
1

answered Jul 25 '12 at 08:09

Christofer Eliasson

32,939
7
74
103

i need a firefox specific attribute for font-family: inherit; only. – user1550884 Jul 25 '12 at 08:27
@user1550884 Added some additional info on a workaround solution. – Christofer Eliasson Jul 25 '12 at 08:45
Thanks Chris. What would be the possible solution in case of IE? – user1550884 Jul 25 '12 at 09:46
@user1550884 Added some additional info on how to target IE with specific CSS. – Christofer Eliasson Jul 25 '12 at 20:45

score 0 · Answer 2 · answered Jul 25 '12 at 08:09

I know you can do this to only target Firefox, the only problem is it's not in the CSS, I'm not sure if there is a way of doing this for font-family in the CSS.

<html>
...
<head>
    <style type="text/css">
    @-moz-document url-prefix() {
        font-family: inherit;
    }
    </style>
</head>
...
</html>

font-family: inherit; specific to mozilla firefox

2 Answers2