CSS an unterschiedliche Bildschirmgrößen anpassen: Eine Anleitung

Question

Ich habe diesen CSS-Code und mein Problem ist, dass meine Seite aufgrund von padding-top (etwas Platz von oben) zu groß ist, was dazu führt, dass sie über die Option „Bildlauf“ verfügt und nicht auf den gesamten Bildschirm passt.

Wie kann ich die Scroll-Option deaktivieren?

* {
    margin: 0;
    padding: 0;
}

html,
body {
    height: 100%;
}
body {
    color: #444;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f7f7f7;
}
.container {
    margin: 0 auto;
    width: 100%;
    height: 100%;
    padding-top: 20px;
}

Ich habe versucht, overflow:hidden; hinzuzufügen und es funktioniert, aber es schneidet einige der unteren Divs ab

Answer 1

将 box-sizing: border-box; 添加到 .container，以将填充包含在 height 的百分比值中。