nicht angemeldet
Layoutprobleme mit den Positionieren
Hallo an Alle,
ich habe Probleme beim Positionieren der DIV Tags. Vielleicht erstmal der Code und darunter eine Tabelle wie es aussehen soll:
<html>
<head>
<style type="text/css">
<!--
div {
background-color: #990000;
}
body {
font-family: Arial, Helvetica, sans-serif;
color: #FFFF00;
}
-->
</style>
</head>
<body>
<div>oben</div>
<div>Menue 1 </div>
<div>Menue 2 </div>
<div>Menue 3 </div>
<div>Menue 4 </div>
<div>Inhalt</div>
<div>unten</div>
<table width="100%" border="0">
<tr>
<td height="100" colspan="3"> </td>
</tr>
<tr>
<td colspan="3" bgcolor="#990000">oben</td>
</tr>
<tr>
<td height="5" colspan="3"> </td>
</tr>
<tr>
<td width="150" bgcolor="#990000">Menue 1 </td>
<td width="5" rowspan="7"> </td>
<td rowspan="7" bgcolor="#990000">Inhalt</td>
</tr>
<tr>
<td height="5"> </td>
</tr>
<tr>
<td bgcolor="#990000">Menue 2 </td>
</tr>
<tr>
<td height="5"> </td>
</tr>
<tr>
<td bgcolor="#990000">Menue 3 </td>
</tr>
<tr>
<td height="5"> </td>
</tr>
<tr>
<td bgcolor="#990000">Menue 4 </td>
</tr>
<tr>
<td height="5" colspan="3"> </td>
</tr>
<tr>
<td colspan="3" bgcolor="#990000">unten</td>
</tr>
</table>
</body>
</html>
Wenn ich nur ein Menue habe - kein Problem mit float: left, nehme ich es weg, werden die Menues untereinander angezeigt, leider auch der Inhalt, setze ich es wieder ein, werden sie nebeneinander angezeigt.
Wo liegt mein Fehler?
Danke im Voraus
HeikoH
-
Hallo an Alle,
ich habe Probleme beim Positionieren der DIV Tags. Vielleicht erstmal der Code und darunter eine Tabelle wie es aussehen soll:
Wenn ich nur ein Menue habe - kein Problem mit float: left, nehme ich es weg, werden die Menues untereinander angezeigt, leider auch der Inhalt, setze ich es wieder ein, werden sie nebeneinander angezeigt.
Wo liegt mein Fehler?Danke im Voraus
HeikoHDein Fehler liegt wahrscheinlich darin, dass du kein <br> einsetzt. Hier mal ein kleiner Versuch meinerseit. Musst vll auch die Breite des Inhaltfeldes noch anpassen.
<html>
<head>
<style type="text/css">
<!--
div {
background-color: #990000;
}
body {
font-family: Arial, Helvetica, sans-serif;
color: #FFFF00;
}
-->
</style>
</head>
<body>
<div>oben</div>
<div style="height:75px; float:right;margin-left:0px;">Inhalt</div>
<div style="float:left;">Menue 1 </div><br>
<div style="float:left;">Menue 2 </div><br>
<div style="float:left;">Menue 3 </div><br>
<div style="float:left;">Menue 4 </div><br>
<div>unten</div>
</body>
</html>Gruß
Fabia-
Danke Fabia für Deine schnelle Antwort
<div>oben</div>
<div style="height:75px; float:right;margin-left:0px;">Inhalt</div>
<div style="float:left;">Menue 1 </div><br>
<div style="float:left;">Menue 2 </div><br>
<div style="float:left;">Menue 3 </div><br>
<div style="float:left;">Menue 4 </div><br>
<div>unten</div>aber ich wollte eigentlich ohne <br> arbeiten, ich habe auch schon versucht das float nur an das Menue 1 anzuhängen, klappt aber auch noch nicht so richtig...
-
Danke Fabia für Deine schnelle Antwort
Bitte. Gerne! :)
aber ich wollte eigentlich ohne <br> arbeiten, ich habe auch schon versucht das float nur an das Menue 1 anzuhängen, klappt aber auch noch nicht so richtig...
Warum denn nicht <br> oder Tabellen arbeiten?
[offtopic]Ich bin auch einer von denen die <div>s bevorzugen. Musste mir aber von nem Informatiker letztens anhören, dass <div>s wesentlich länger zum Rendern brauchen usw und sowieso doof sind :)[/offtopic]
Gruß
Fabian-
hi,
[offtopic]Ich bin auch einer von denen die <div>s bevorzugen.
Also kein sinnvolles HTML?
Musste mir aber von nem Informatiker letztens anhören, dass <div>s wesentlich länger zum Rendern brauchen usw und sowieso doof sind :)[/offtopic]
Schwachsinns-Aussage.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hallo wahsaga
[offtopic]Ich bin auch einer von denen die <div>s bevorzugen.
Also kein sinnvolles HTML?
Was ist dann sinnvolles HTML?
HeikoH
-
-
ich glaube des Rätsels Lösung gefunden zu haben.
Der Inhalt DIV kommt nach Menue 1 welches mit float:left ausgestattet ist und erst nach dem Inhalt die anderen menues ohne float:left<div style="margin: 8em 0 1.1em">oben</div>
<div style="float: left; width: 15em; margin: 0 0 1.2em;">Menue 1 </div>
<div style="margin: 0 0 1em 18em;">Inhalt</div>
<div style="width: 15em; margin: 0 0 1.2em;">Menue 2 </div>
<div style="width: 15em; margin: 0 0 1.2em;">Menue 3 </div>
<div style="width: 15em; margin: 0 0 1.2em;">Menue 4 </div>
<div style="margin-top: 1.1em; clear: both;">unten</div>Frage an die Profis: richtig?
HeikoH
-
<div style="margin: 8em 0 1.1em">oben</div>
<div style="float: left; width: 15em; margin: 0 0 1.2em;">Menue 1 </div>
<div style="margin: 0 0 1em 18em;">Inhalt</div>
<div style="width: 15em; margin: 0 0 1.2em;">Menue 2 </div>
<div style="width: 15em; margin: 0 0 1.2em;">Menue 3 </div>
<div style="width: 15em; margin: 0 0 1.2em;">Menue 4 </div>
<div style="margin-top: 1.1em; clear: both;">unten</div>Frage an die Profis: richtig?
HeikoH
Sieht schon ganz gut aus. Aber jetzt mach mal in den "Inhalt-Div" mal mehrere Zeilen rein bzw ne bestimmte Höhe. Dann verschiebt es dir ziemlich sicher die Menu 2 usw nach unten.
Gruß
Fabian-
Sieht schon ganz gut aus. Aber jetzt mach mal in den "Inhalt-Div" mal mehrere Zeilen rein bzw ne bestimmte Höhe. Dann verschiebt es dir ziemlich sicher die Menu 2 usw nach unten.
Tja, wohl wahr - und nun? Also noch mal von vorne. Es muss doch gehen...
...auch ohne <br> und ohne Tabellen.HeikoH
-
...auch ohne <br> und ohne Tabellen.
Warum denn???? :D Ich finde das sehr erheiternd. Aber sag doch mal einen Grund warum du das so machen willst!!!
Fabian
-
Warum denn????
Mit <br> wird, finde ich, eine feste Hoehe generiert, wenn ich es aber, beispielsweise, mit margin-top positioniere, habe ich mehr Spielraum um es vielleicht ein px oder em nach oben oder unten schieben möchte.
HeikoH
-
-
-
-
-
-
-
-
Hallo,
ich habe Probleme beim Positionieren der DIV Tags. Vielleicht erstmal der Code und darunter eine Tabelle wie es aussehen soll:
Dein Hauptproblem ist vermuitlich, dass du die Browser durch fehlende Doctypeangabe in den Quirksmode versetzt, was bei einem CSS-Werkzeug wie Positionierung fatale Folgen haben kann.
Siehe: Der »DOCTYPE-Switch« und seine Auswirkungen
Gruß;
-
Hallo,
Dein Hauptproblem ist vermuitlich, dass du die Browser durch fehlende Doctypeangabe in den Quirksmode versetzt, was bei einem CSS-Werkzeug wie Positionierung fatale Folgen haben kann.
Das ist wird imho nicht das Hauptproblem sein. Aber grundsätzlich auf jeden Fall richtig.
-
-
hallo,
ich habe Probleme beim Positionieren der DIV Tags.
Wieso? Nach dem Code, den du vorstellst, hast du kein einziges Element positioniert. Und solnage du nichts positionierst, kannst du damit auch keine Probleme haben, alle Elemente verhalten sich so wie sie es eben ohne Positionierung tun.
Grüße aus Berlin
Christoph S.
-
hallo,
ich habe Probleme beim Positionieren der DIV Tags.
Wieso? Nach dem Code, den du vorstellst, hast du kein einziges Element positioniert.
Ja. Stimmt schon formal. Aber sowas bringt doch niemanden weiter, oder? Es ist doch klar wie er es gemeint hat. Nur hat er sich nicht "webdesigner-valides-html-mäßig"-richtig ausgedrückt.
-
hallo,
Aber sowas bringt doch niemanden weiter, oder?
Ich denke schon, daß der Link, den ich angegeben habe, für Fragen zur Positionierung "weiterbringend" ist.
Es ist doch klar wie er es gemeint hat.
Eben. Und dazu taugt am besten, sich tatsächlich mit Positionierung zu beschäftigen.
Grüße aus Berlin
Christoph S.
-
-