I'm creating a site on wordpress. I'm not using the standard css file provided by the theme instead I created my own css file and I have it being loaded in the scripts.php file using wp_enqueue_style.
This works perfect as I tried adding css to my newly added css file and the changes are occurring. However I'm unable to get media query to work. This theme uses bootstrap. Since I'm using bootstrap I used something like this
@media (min-width: @screen-md-min) { }
however that didn't work so I went ahead and tried using something like this
@media screen and (min-width: 480px) { }
Then I went ahead and added this to the top of the css file
<meta name="viewport" content="width=device-width" />
This didn't help either. Anyone know why my media query aren't working?
Here is a link to My Site.
Your problem is the way you are commenting lines in CSS as if you were commenting JAvascript.
/*Right Way To Comment*/
p{color:red;}
//Wrong Way To Comment
p{color:blue;}
See this example and notice the text doesn't change to blue but it did to red
The meta tag belongs in a HTML document.
Also as far as why your styling isn't being applied, I believe it is due to your comment // Remember to style mobile first!!. This type of comment is not used in stylesheets and is breaking your css at this point. You should use /* COMMENT */ for all comments in stylesheets.