0

I'm working on making a responsive version of a magento theme on this website https://makedaadolls.com/store/

Why when I resize my window less than 750px, the html tag still has 980px of width?

Here is my css rule.

@media only screen and (max-device-width: 750px) and (min-device-width: 320px){
    html {
        width: 100%;
        max-width: 750px;
    }
}

1 Answer 1

0

You need at least the responsive meta tag in your site header:

<meta name="viewport" content="width=device-width, initial-scale=1">

Then you need to make sure your header and main nav are also responsive (they currently are not). Basically this means all your containers need to have a max-width instead of a width. You won't need to set your html to be responsive using your media query in this case.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.