Wieso wird margin-bottom nicht ausgeführt?
Conny
- css
Hallo ihr,
meine Seite ist folgendermaßen aufgebaut:
<body>
<div class="container">
<span class="ueberschrift">Überschrift</span>
<div class="menue">Wiederum divs für die einzelnen Menüpunkte</div>
<div class="inhalt"></div>
</div>
</body>
Bei viel Inhalt klebt der Container direkt unten am Rand, wo er natürlich Abstand halten soll. Mein margin-bottom:20px; wird aber nicht angenommen. Auch nicht, wenn ich den Container noch mal in ein div einschließe. Es hilft auch nichts, eine weitere, leere Ebene hinten an zu fügen mit einer bestimmten Höhe; position: absolute, relative, float usw. - nichts hilft.
Alles was ich innen verändere, also padding oder neue Ebenen, wird akzeptiert.
Die style-Angaben:
.container {
position:absolute;
top:60px;
left:20px;
margin-bottom:20px;
width:700px;
padding:0px;
background-color:#CCCC99;
border:2px solid #336600;
}
.ueberschrift {
position:relative;
top:10px;
left:10px;
font-size:22pt;
font-weight:bold;
}
.menue {
float:left;
margin:30px 0px 10px 0px;
font-weight:bold;
}
.inhalt {
margin:30px 30px 10px 190px;
}
Ich kapier's nicht, das ist doch eine stinknormale Sache. Hat irgendjemand eine Idee, was da falsch läuft?
Conny
Hi,
<span class="ueberschrift">Überschrift</span>
ähm, das Ding heißt <h1>.
<div class="menue">Wiederum divs für die einzelnen Menüpunkte</div>
Und dieses <ul> (das Innere).
<div class="inhalt"></div>
Wenn Du nur einen Inhalt hast (und ein Menü), lohnt sich eine ID anstatt einer Klasse.
Bei viel Inhalt klebt der Container direkt unten am Rand, wo er natürlich Abstand halten soll. Mein margin-bottom:20px; wird aber nicht angenommen.
Dann wendest Du es vermutlich auf das falsche Element an.
Auch nicht, wenn ich den Container noch mal in ein div einschließe.
Noch mehr falsche Elemente einzuführen ist da auch nicht hilfreich.
position:absolute;
Mit absoluter Positionierung sollte man mehr als vorsichtig sein. Versuch's ohne.
width:700px;
Warum wählst Du eigentlich eine Größe, die so gar nicht mit den Vorlieben Deiner User vereinbar ist?
font-size:22pt;
Das ist eine der mit Abstand ungünstigsten Einheiten für Screenmedien. Benutze em oder %.
Ich kapier's nicht, das ist doch eine stinknormale Sache.
Kommt darauf an, was genau Du vermutest.
Cheatah
Moin
<div class="menue">Wiederum divs für die einzelnen Menüpunkte</div>
Und dieses <ul> (das Innere).
Für jedes <li> einen eigenen Teil-Rahmen definieren? Hm, jo, müsste genauso funktionieren. Wo genau liegt allerdings der Vorteil? Es dürfte egal sein, ob <div> oder <li>, oder?
<div class="inhalt"></div>
Wenn Du nur einen Inhalt hast (und ein Menü), lohnt sich eine ID anstatt einer Klasse.
Brächte das irgendwelche Vorteile?
Bei viel Inhalt klebt der Container direkt unten am Rand, wo er natürlich Abstand halten soll. Mein margin-bottom:20px; wird aber nicht angenommen.
Dann wendest Du es vermutlich auf das falsche Element an.
Da sich die Inhalte im Container befinden und ebendieser den Abstand halten soll, bringe mir bitte einen einleuchtenden Grund, wieso das das falsche Element sein sollte.
Conny
hi,
Für jedes <li> einen eigenen Teil-Rahmen definieren? Hm, jo, müsste genauso funktionieren. Wo genau liegt allerdings der Vorteil? Es dürfte egal sein, ob <div> oder <li>, oder?
HTML soll daten gemäß ihrer bedeutung auszeichnen.
welche bdeutung vermittelt ein <div>?
welche ein <ul><li>?
gruß,
wahsaga
Moin
Für jedes <li> einen eigenen Teil-Rahmen definieren? Hm, jo, müsste genauso funktionieren. Wo genau liegt allerdings der Vorteil? Es dürfte egal sein, ob <div> oder <li>, oder?
HTML soll daten gemäß ihrer bedeutung auszeichnen.
welche bdeutung vermittelt ein <div>?
welche ein <ul><li>?
Also kein Vorteil, nur ein Ordentlichkeitsfaktor. :-)
(Der ja durchaus auch sein Gewicht hat.)
Hi,
Also kein Vorteil, nur ein Ordentlichkeitsfaktor. :-)
Mehr als das. <div> sagt eigentlich nichts aus, es ist nur ein Container. Und wie sieht Deine Seite wohl ohne CSS aus, wenn Du alle Inhalte nur in sinnfreie Container verpackt hast und der Browser keine Informationen dazu hat, um welche Form von Daten es sich genauer handelt. Vergleiche: eine gut strukturieres HTML-Dokument mit sinnvoll eingesetzen <h1>, <ul>, <li>, etc.. sieht auch ohne CSS noch ganz gut, gemäß seiner Struktur, aus und ergibt einen Sinn.
MfG
Danny
hi,
Vergleiche: eine gut strukturieres HTML-Dokument mit sinnvoll eingesetzen <h1>, <ul>, <li>, etc.. sieht auch ohne CSS noch ganz gut, gemäß seiner Struktur, aus und ergibt einen Sinn.
was natürlich nicht nur betrachter, die CSS abgeschaltet haben, zu honorieren wissen, sondern beispielsweise auch die suchmaschinen, die mit einem ordentlich strukturierten dokument wesentlich mehr anzufangen wissen, also mit einer unstrukturierten textwüste.
gruß,
wahsaga
Hallo,
was natürlich nicht nur betrachter, die CSS abgeschaltet haben, zu honorieren wissen, sondern beispielsweise auch die suchmaschinen, die mit einem ordentlich strukturierten dokument wesentlich mehr anzufangen wissen, also mit einer unstrukturierten textwüste.
Dazu kommen dann noch Blinde, die sich die Webseite vorlesen lassen. Ohne ein klare Struktur raffen die da garnix..
Viele Grüße
Patrick
Hallo Conny,
position:absolute;
top:60px;
left:20px;
Wenn du deinen div-Container so positionierst, definierst du die Position der linken obere Ecke. Sobald der Anzeigebereich zu klein für den Inhalt wird (oder der Inhalt zu groß für den Anzeigebereich), wird von unten her abgeschnitten -> darum ist ein margin-bottom sinnlos (der Container wird ja nicht gequetscht).
Dasselbe gilt auch, wenn du nicht absolut positionierst und auf dein "container"-div kein anderes Element folgt, da auch wieder "von unten her" abgeschnitten wird, sobald der Anzeigebereich zu klein für die Elemente wird.
Ich hoffe, die beiden Abschnitte sind verständlich und du weißt, was ich meine...
Gruß,
Peetah