Rowby Goren
asked on
Media Query(s) not working in Firefox
Hello
I am having an issue with media queries in Firefox. I have two media queries that work in IE, Chrome and Safari. But when I test them in Firefox, they are not working.
Please look at this page first in Firefox Check this out in IE or Chrome or Safari In my mockup you will see a Hamburger and the words "Practice Areas". You will also see a text menu on the right. I am hiding them from desktop with media queries -- which are working in the other browsers.
Any suggestions to fix this issue? I googled this issue and found some comments but they mainly seem to appear only with older versions of Firefox.
????
Thanks
Rowby
I am having an issue with media queries in Firefox. I have two media queries that work in IE, Chrome and Safari. But when I test them in Firefox, they are not working.
Please look at this page first in Firefox Check this out in IE or Chrome or Safari In my mockup you will see a Hamburger and the words "Practice Areas". You will also see a text menu on the right. I am hiding them from desktop with media queries -- which are working in the other browsers.
Any suggestions to fix this issue? I googled this issue and found some comments but they mainly seem to appear only with older versions of Firefox.
????
Thanks
Rowby
For starters, your HTML formatting is wrong. You have 3 </head> tags and two <body> tags and a style section in an <li>. Until you fix the formatting, there is no point in trying to fix what you think your problem is.
ASKER
Hi Dave!
I guess I overmarkedup!
I think I got rid of the excess heads and body. At least I can't find them in my source code now.
Is this the <li> issue you were referring to?
Thanks
Rowby
I guess I overmarkedup!
I think I got rid of the excess heads and body. At least I can't find them in my source code now.
Is this the <li> issue you were referring to?
li { padding: 8px 0; border-bottom: 2px solid #000; }
</style><style id="searchstatus-nofollow">a[rel~="nofollow"] { outline: thin dashed firebrick ! important; background-color: rgb(255, 200, 200) ! important; }</style><ol><li>
Thanks
Rowby
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Stay tuned -- will be working on this.....
ASKER
Hi Dave
While I have yet to deal with 99 percent of the validation issues, I have found a workaround that fixed this issue.
So I'll close the question acknowledging the need to deal with the validation.
Thanks again!
Rowby
While I have yet to deal with 99 percent of the validation issues, I have found a workaround that fixed this issue.
So I'll close the question acknowledging the need to deal with the validation.
Thanks again!
Rowby
You're welcome.