CODEWITHSUNDEEP
cssmedia-queries
Khuram Malik
Khuram Malik

Reputation: 1485

very simple media query not working

I have copied some media query code from elsewhere which works absolutely fine, but when incorporating into my own project, it doesn't seem to work.

I've looked at previous stackoverflow questions, and tried implementing the fixes or tests such as,

checking whether the media query is working by applying an unwanted background color, which fails. I've also made sure to add the viewport metatag.

Here is my media query

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) { 

body { margin: 5px; width: 5px; }

.testimonial {

            background-color: black;
        }


 }

The live page can be seen here (click on testimonials, and then click on a picture): http://krmmalik.com/me/

update: Just spoke to a colleague and he seems to think that the reason the media queries are not working is because the testimonials content is being loaded in an iframe at which point the media detection doesn't take place?

Upvotes: 0

Views: 377

Answers (1)

Simon Arnold
Simon Arnold

Reputation: 16157

I tried this and it work perfectly.
why would you set the body width to 5px, if the max-width should be 479px?

@media screen and (max-width: 479px){
   body { 
     margin: 5px;
   }
   .testimonial {
     background-color: #000;
   }
 }

Upvotes: 1

Related Questions