Embedded CSS Media Queries Not Working
- by Greg
I am new to CSS media queries, and I was first trying to get pdf/mp3/mp4 buttons to get centered on this page whenever a mobile device is using it (http://www.mannachurch.org/portfolio-type/recycled-junk/). Keep in mind for that I am using a highly modified wordpress theme.
So I tried experimenting to isolate this issue. However, I don't seem to have any control over using media queries and I can't even perform anything even on this simple HTML file:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style type="text/css">
body{background-color: blue;}
@media only screen and (min-device-width : 599px) and (max-device-width : 600px) {
body {background-color:black;
}
}
</style>
</head>
<body>
<p>This is an experiment<p/>
</body>
</html>
What am I doing wrong?