Frage von bratwurstbro190, 53

CSS Seitenabstand zur Seite oben ändern?

Hallo, ich finde den Fehler gerade leider nicht: ich habe ein Layout mit verschiedenen Div-Containern erstellt und habe die Container in einem Wrapper zentriert. Jetzt bleibt aber immer ein Rand zur Seite oben übrig. Was muss ich an meinem Code ändern? Danke :)

HTML:

<div id="site-wrapper">

<header id="header"> </header>

<main id="main"></main>

<div id="sidebar"></div>

<div id="media"></div>


<footer id="footer"></footer>

</div>

CSS:

    body {background: #fff;}
#site-wrapper {margin: 0 auto; max-width: 1024px; height: 100%; background: #fff; overflow: hidden;}

/* Main sections */

#header {width: 100%; height: 160px; background: orange; padding: 2%;}
#main {width: 67%; height: 100%; float: left; background: yellow; padding: 2%;}
#sidebar {width: 27%; height:100%; float: left; background: blue; padding: 1%;}
#media {clear: both; height: 300px; background: red;}
#footer {width: 100%; height: 100px; padding: 2%; background: purple;}
Antwort
von mastema666, 35

Versuch mal den body so anzupassen:

body {background: #fff; margin: 0;}
Kommentar von bratwurstbro190 ,

Das Problem ist, die Seite verschiebt sich beim Anpassen nur etwas nach oben, es ist garantiert noch 1cm Platz. Hast Du noch eine andere Idee? Gerne auch per PN.

Antwort
von Eutervogel, 15

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

Antwort
von Dory1, 34
body { margin:0; }
Kommentar von bratwurstbro190 ,

Das Problem ist, die Seite verschiebt sich beim Anpassen nur etwas nach oben, es ist garantiert noch 1cm Platz. Hast Du noch eine andere Idee? Gerne auch per PN.

Kommentar von Dory1 ,

Hast du uns den kompletten Quellcode gezeigt? Hier eine Demo mit deinem Code http://codepen.io/anon/pen/ONqbPr
Ich sehe da keinen Abstand.

Kommentar von fluffiknuffi2 ,

Ich kann mich dem auch nur anschließen. Sehe keinen Abstand (Opera 37) wenn body margin: 0 hat. Sonst halt die üblichen 8px.

Sicher dass du keinen unsichtbaren Inhalt vor dem div mit der ID site-wrapper hast? Zum Beispiel ein geschützes Leerzeichen ( &nbsp; )

Kommentar von bratwurstbro190 ,

In Chrome sehe ich auch keinen, aber komischerweise in Safari. Hast Du eine Ahnung, warum? Ist für ein WP-Theme.

Kommentar von fluffiknuffi2 ,

Da kann ich dir nicht weiter helfen, Safari wird von mir ignoriert bis ich aufhöre darüber zu lachen, dass Apple mir weiß machen will, Studierenden entgegenzukommen, indem >1000 € Produkte einen Rabatt von 50 € erhalten. Voraussichtlich wird es im Jahr 2034 soweit sein... :p

Keine passende Antwort gefunden?

Fragen Sie die Community