DIV-Abstand entfernen (HTML/CSS)
Wenn ich meine Datei in DIV-Elemente aufteile, wird im Browser automatisch ein Abstand zwischen diesen eingefügt. Dabei spielt es keine Rolle, ob ich als Browser Chrome oder Firefox verwende. Gibt es eine Möglichkeit das zu unterbinden?
5 Antworten
Um in allen Browsern die gleiche Ausgangssituation zu haben, sollte man ein sogenanntes Reset-Sheet einsetzen.
Im Prinzip genügt es, wenn du ganz oben in deiner CSS Datei die Innen- und Außenabstände zurücksetzst.
html, body, div { margin: 0; padding: 0; }
Du kannst dir zudem das hier mal anschauen:
* ( margin: 0; padding: 0; } geht natürlich auch, in diesem Fall.
* ist ein Rundum-Schlag, der Inline-Elemente (span, a, etc) genauso erschlägt wie das highest-level markup von html … /html - da würde ich die Finger von lassen.
Lies Dich am besten wirklich bei de.html5boilerplate.com in die Thematik "HTML-Reset" ein, dann weißt Du, was Du Dir damit antust.
Die Fragestellung waren DIV-Boxen, da reicht das Ansprechen genau dieser Elemente. Dass es evtl nur die einzigen Elemente waren, wo es Dir bewusst wurde, heißt nicht, dass sich die Browser bei anderen Elementen alle gleich verhalten. Frag mal nen Webdesigner nach Internet Explorer ;--)
Noch ein Reset findest Du hier: http://kingdesk.com/articles/css-reset/
Benutze ein CSS reset oder teile deine Dateien nicht in div Elemente auf.
Benutzre div nur da wo es sinnvoll und semantisch richtig ist.
In meinem CSS reset habe ich schon eingegeben:
* {
margin: 0px;
padding: 0px;
}
Meinst du so?
div style="clear:both"
div style="float:left" Hallo1/div
div style="float:left" Test /div
div style="float:left" Javascript /div
/div
Ich weiß gerade nicht was du meinst. Ich kann kein Javascript, sondern nur PHP. Und float wird doch eingesetzt, damit etwas umfossen wird. Aber die DIVs sollen ja untereinander sein, nur eben ohne Abstand dazwischen, den ich mir nicht erklähren kann. Und weshalb ich hier frage.
Achsooooooo
Jetzt verstanden. Würde auch zu margin: 0; padding: 0; tendieren. Wenn das nicht klappt wüsste ich nur ne sehr riskante Ausweichlösung. Einfach die Divs mit position:absolute und z.B. top:10px; left:5px; anpassen.
Wie gesagt, es besteht halt ein großes Risiko, dass es nicht richtig dargestellt wird..
Ansonsten wüsste ich nichts. Wie wäre es mit Screenshot und Code?
Ich würde ja sehr gerne den Code zeigen, aber wie soll ich das machen? Wenn ich den Code eingebe, dann sieht das Ergebnis nicht gerade wünschenswert aus.
Screenshot, irgendwo hochladen, woanders posten wo es geht, ...
ich weiß nicht so ganz, was du meinst und vor hast, aber den Abstand definiert man gewöhnlich mit "padding"... google doch mal mit den Schlagworten :)
mit padding definiert man den innenabstand. bei "lücken" zwischen zwei divs kommt margin zum tragen
ah ich glaube, jetzt weiß ich auch, was gemeint war, ja ;-)
"margin" wäre dein ansatz. ein keine
oder "zwischen" den div-containern
da das script hier offenbar html interpretiert, der letzte satz noch mal:
kein br oder p zwischen den div containern
Zwischen den DIVs befindet sich kein Absatz oder Zeilenumbruch.
Geht doch auch mit *. Oder ist es etwas anderes. Ich dachte das Sternchen umfasst alles.