This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

ఇంకా తెలుసుకోండి

Firefox 9 support of css3 media queries

  • 6 ప్రత్యుత్తరాలు
  • 2 ఈ సమస్యలు కలిగి ఉన్నాయి
  • 2 వీక్షణలు
  • చివరి సమాధానమిచ్చినది tslatt

more options

Firefox 9 is behaving differently than earlier versions when it comes to css3 media queries. Is there any way to get it to behave properly?

I use different style settings based on the width. FF9 ignores the changes in width and just displays the maximum width css. Older versions would use different settings based on how wide the browser currenly was.

@media only screen and (max-width: 320px) {
	...my styles here
}
@media only screen and (min-width: 321px) and (max-width: 480px) {
	...my styles here
}
@media only screen and (min-width: 481px) and (max-width: 700px) {
	...my styles here
}
@media only screen and (min-width: 701px) and (max-width: 960px) {
	...my styles here
}
@media only screen and (min-width: 961px) {
	...my styles here
}
Firefox 9 is behaving differently than earlier versions when it comes to css3 media queries. Is there any way to get it to behave properly? I use different style settings based on the width. FF9 ignores the changes in width and just displays the maximum width css. Older versions would use different settings based on how wide the browser currenly was.<br /> <br /> <pre><nowiki>@media only screen and (max-width: 320px) { ...my styles here } @media only screen and (min-width: 321px) and (max-width: 480px) { ...my styles here } @media only screen and (min-width: 481px) and (max-width: 700px) { ...my styles here } @media only screen and (min-width: 701px) and (max-width: 960px) { ...my styles here } @media only screen and (min-width: 961px) { ...my styles here }</nowiki></pre>

న cor-el చే మార్చబడినది

ఎంపిక చేసిన పరిష్కారం

I finally had to just use this to make media queries work correctly in FF9:

http://code.google.com/p/css3-mediaqueries-js/

ఈ సందర్భంలో ఈ సమాధానం చదవండి 👍 0

ప్రత్యుత్తరాలన్నీ (6)

more options

A good place to ask advice about web development is at the MozillaZine "Web Development/Standards Evangelism" forum.

The helpers at that forum are more knowledgeable about web development issues.
You need to register at the MozillaZine forum site in order to post at that forum.

more options

On my Vista computer these media queries are working fine. Did you try to run in Safe Mode to see if this is caused by an add-on on your computer?

more options

I have tried it on two separate Windows 7 machines running Firefox 9.0.1. Disabling add-ons had no effect. The media queries work fine in all other browsers on the same machines. The styles in the media queries cause the site to display differently based on how wide the browser is, but in FF9, there is no change when the browser changes width.

more options

Do you have a test page?

Did you check the Error Console for errors relating this problem?

more options

There are no errors in the error console.

more options

ఎంపిక చేసిన పరిష్కారం

I finally had to just use this to make media queries work correctly in FF9:

http://code.google.com/p/css3-mediaqueries-js/