2016-09-13 7 views
0

私はReactJSウェブサイトを最近Herokuに配備しており、ウェブサイトがモバイルレスポンスになるために必要なものはあると信じていますが、デスクトップ上で見た場合の見た目を正確に見ています。モバイルで見た場合、すべてが極端に小さくなります。ReactJS + Heroku:なぜ私のウェブサイトはモバイルレスポンスにならないのですか?

何が問題になりますか?ここで

はHTMLです:

<html lang="en" class="practice"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="x-ua-compatible" content="ie=edge"> 
    <meta name="mobile-web-app-capable" content="yes"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <title>Practice Web</title> 
    <meta name="description" content="practice"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    </head> 
    <body> 
    <div id="app"></div> 
    <script type="text/javascript" src="/bundle.js"></script></body> 
</html> 
+0

これは、フォーマットを除いて私にはうまく見えます。モバイルでどのようにテストしていますか? – arnolds

+0

@arniekoz私はちょうどURLにまっすぐ行く。何が問題になる可能性がありますか... –

+0

Chromeの開発ツール、デバイスインスペクタ、シミュレータ、または...を使用していますか? – arnolds

答えて

0

はたぶんコンテンツは画像や何かのように、コンテナを越えて延びます。その場合、これを試してみてください:

<html lang="en" class="practice"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="x-ua-compatible" content="ie=edge"> 
    <meta name="mobile-web-app-capable" content="yes"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <title>Practice Web</title> 
    <meta name="description" content="practice"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <style type="text/css"> 
     body { 
     width: 100%; 
     overflow: hidden; 
     } 
    </style> 
    </head> 
    <body> 
    <div id="app"></div> 
    <script type="text/javascript" src="/bundle.js"></script> 
    </body> 
</html> 
+0

がついにそれを試してみましたが、残念ながらまだ動作しません。それはHerokuの問題だろうか? –

関連する問題