較小屏幕尺寸的配置問題

左側的圖片是現在在手機屏幕上的樣子。右邊的圖片是我想要的樣子，每行可以填寫更多的單詞。我將html背景設置爲紅色以突出顯示它，並將body div顯示爲灰色。較小屏幕尺寸的配置問題

我需要什麼樣的變化作出的代碼，以得到這一結果？我不確定頁面爲什麼在右側包含該部分，但左側看起來沒問題。我想從屏幕上取下那部分。我不知道，如果這一段代碼可以幫助，但在這裏它是：（也許它做的div.container）

@media only screen and (max-width: 680px) { 
     div.container { 
     margin: 0 auto; 
     width: auto !important; 
    }

來源

2017-01-01 Alexander

檢查'右padding'或'MAX-width'規則 – Aziz

在樣式添加這些：

html,body{ 
    margin: 0 !important; 
    padding: 0 !important; 
}

如果它不「任何意義，那麼在此HTML視添加到您的head標籤：

<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1; minimum-scale=1; user-scalable=no; target-densityDpi=device-dpi" />

來源

2017-01-01 17:31:05 JustCauseWhat

我都嘗試，並沒有運氣。當我改變筆記本電腦屏幕的寬度時，它可以順利運行。但是當我在手機上查看該網站時，該html空間就在那裏。也許代碼「認爲」屏幕尺寸小於實際的手機尺寸？ – Alexander

@亞歷山大如果你給我的在線鏈接，那麼我可以幫助你！ – JustCauseWhat

' Alexander

較小屏幕尺寸的配置問題

回答

相關問題