Nirmal Scaria
Nirmal Scaria

Reputation: 51

How to set the initial scale meta tag to fit body width?

I have a page that looks terrible below 500px width. In mobile devices less than 500px width, is there any way to automatically set the initial scale meta tag to fit the width of viewport with width of body?

I have already tried to set min-width of body to 500px, but clearly, that would have to be zoomed out manually to see the full page on screens less than 500px width.

Upvotes: 4

Views: 1146

Answers (1)

Libor Plíšek
Libor Plíšek

Reputation: 61

You can use JavaScript. Did you try something like this?

<meta id="viewport" name="viewport" content="width=device-width, initial-scale=1">
<script>
    window.onload = function() {
        if (screen.width < 500) {
            var metaViewport = document.getElementById('viewport');
            metaViewport.setAttribute('content', 'user-scalable=no,width=500');
        }
    }
</script>

Upvotes: 1

Related Questions