Generelle css-Frage

Ja, jetzt seh ichs.
Eigentlich sollten Listen in div-Containern kein Problem sein. Was auch etwas seltsam ist, ist, dass der Header laut CSS viel höher sein müsste als er im Screenshot ist.
Kannst du vielleicht die HTML-Seite irgendwo hochladen? Damit lässt sich besser analysieren, was wo steht.

Hi,
vieleicht wirds so klarer:

http://screencast.com/t/wsGhHtRZ2xh

Um deine Frage korrekt beantworten zu können, müsste ich noch mehr Details zu dem Problem erfahren.

Divs ohne feste Höhenangabe reagieren anders auf den Inhalt. Da das
ein Block-Element ist, wird es immer auf die gesamte Breite des DIVs gespannt. Außerdem hat das
immer einen vorgegebenen Abstand zum Rest. Diesen kannst du aber wegbekommen.

Als Lösung kannst du mal folgendes ausprobieren:

ul { margin:0; padding:0; display: inline-block; }

ich verstehe die frage nicht so-
bei , aber das war wohl nicht das problem, oder? ansonsten, also mit 2 mal > wird alles angezeigt

Hi,
also hie etwas css:

//*****************************Menu***********/

ul {
padding: 0px;
margin: 0px;
list-style: none;
display:block;
overflow:hidden;
}
li {
float: left;
position: relative;
width: 10.5em;
font-size:0.8em;
list-style: none;
background-color:green; display:block;
overflow:hidden;
}
/*********** The dropdown*/
li ul { display:block;
overflow:hidden;
display: none;
position: absolute;
top: 10em;
left: 0px; background-color:red;
}
li > ul { display:block;
overflow:hidden;
top: auto;
left: auto;
}
li:hover ul, li.hover ul{ display: block;
}
ul.hover li
{ display:block;
overflow:hidden;

}
/*****************************Menu***********/

div
{
border:3px double green;
}

Wie http://screencast.com/t/wsGhHtRZ2xh

zeigt soll der inhalt des Menus in den div-Container.
Oder ist es so, dass die Höhe eines divs nur angepasst wird, wenn da text drinne ist?
Nur dann kann ich mir den Div doch sparen.
Gruß
Oliver

Hi,

also hier ein Screenshot:
http://screencast.com/t/wsGhHtRZ2xh

und etwas css

//*****************************Menu***********/

ul {
padding: 0px;
margin: 0px;
list-style: none;
display:block;
overflow:hidden;
}
li {
float: left;
position: relative;
width: 10.5em;
font-size:0.8em;
list-style: none;
background-color:green; display:block;
overflow:hidden;
}
/*********** The dropdown*/
li ul { display:block;
overflow:hidden;
display: none;
position: absolute;
top: 10em;
left: 0px; background-color:red;
}
li > ul { display:block;
overflow:hidden;
top: auto;
left: auto;
}
li:hover ul, li.hover ul{ display: block;
}
ul.hover li
{ display:block;
overflow:hidden;

}
/*****************************Menu***********/

div
{
border:3px double green;
}

Also eigendlich ganz banal 3 Blöcke. Im oberen soll nur ein Menü und später ein Bild rein. Im Mittleren ein Inhalt und unten später einen Footer.

Ich hoffe, nun ists klarer geworden?
Gruß
Oliver

Hi,

also hier ein Screenshot:
http://screencast.com/t/wsGhHtRZ2xh

und etwas css

//*****************************Menu***********/

ul {
padding: 0px;
margin: 0px;
list-style: none;
display:block;
overflow:hidden;
}
li {
float: left;
position: relative;
width: 10.5em;
font-size:0.8em;
list-style: none;
background-color:green; display:block;
overflow:hidden;
}
/*********** The dropdown*/
li ul { display:block;
overflow:hidden;
display: none;
position: absolute;
top: 10em;
left: 0px; background-color:red;
}
li > ul { display:block;
overflow:hidden;
top: auto;
left: auto;
}
li:hover ul, li.hover ul{ display: block;
}
ul.hover li
{ display:block;
overflow:hidden;

}
/*****************************Menu***********/

div
{
border:3px double green;
}

Also eigendlich ganz banal 3 Blöcke. Im oberen soll nur ein Menü und später ein Bild rein. Im Mittleren ein Inhalt und unten später einen Footer.

Ich hoffe, nun ists klarer geworden?
Gruß
Oliver

Du musst dem div „head“ eine feste Größe zuweisen. Sonst bringt der Befehl „overflow-hidden“ nämlich nichts. Der Browser weiß ja nicht, wann dein Feld überfüllt ist, weil er es ja gleichzeitig auf die nötige Größe anpasst.

Gib also mal folgendes an:
div#head {
width: 800px;
height: 20px;
}
ul {
width: 800px;
height: 20px;
padding: 0px;
margin: 0px;
list-style: none;
overflow: hidden;
}

Dann sollte deine Liste im Feld stehen.

ja, ist klarer geworden-
bei
//*****************************Menu***********/
ist am anfang 1 schrägstrich zuviel- es müsste so aussehn
/*****************************Menu***********/
danach ging es bei mir-

  • jaso

  • janee

  • oha

Hallo

usw.

ja?
viel erfolg, sonst wieder melden-
schöne grüße
christiane

Hallo Oliver,

mal davon abgesehen, dass vor dem „Hallo“ der letzte div-Tag nicht geschlossen wurde… wenn ich die beiden spitzen Klammern setze, dann wird auch alles korrekt angezeigt.
Das Problem kann ich ohne die css-Anweisungen nicht nachvollziehen.

Hm, klar die Klammer. Danke für Deine Antwort.
Aber das wars nicht. Musste nur ein height noch rein.
Anscheind wird wohlnur reiner Text als Höhengeber anerkannt.

Gruß
Oliver