I am facing an issue with a simple media query that is not working as expected in Chrome or IE, but strangely it works fine in FF. I have tried various formulations of the media query without success. Any assistance would be greatly appreciated.
Below is a snippet of the HTML:
<div class="all">
Adipiscing accumsan at habitasse pharetra eu a magna sollicitudin ...</div>
Here is the CSS:
body {
font-weight: bold;
font-family: sans-serif;
font-size: 20px;
background: white;
}
.all {
width: 200px;
margin: auto;
margin-top: 300px;
background: blue;
}
@media only screen and (max-width: 700px) {
.all {
width: 690px;
font-size: 30px;
}
}