• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Html-Kasten nebeneinander

Taucherin

Neues Mitglied
Hallo ihr Lieben,
ich hoffe von euch kann mir jemand helfen... Ich bin gerade dabei an meine erste Website zu erstellen -> das heißt ich bin eine totale Anfängerin. Das Problem ist folgendes: Ich habe mir gedacht, dass ich meine Seite am besten mit html-Kästchen strukturieren könnte und nicht mit Tabellen, da mir das besser gefällt. Ich würde gerne zwei html-kasten nebeneinander und nicht versetzt oder untereinander, sondern genau auf einer (imaginären) horizontalen Linie erstellen, aber mir gelingt das nicht. Denn der eine html-Kasten fängt immer dort an, wo der Text des anderen Html-Kastens aufhört. Versteht ihr was ich meine? Hier ist auf jeden Fall der html-Code:
<body>
<div style="margin:0; margin-right:1px; margin-left:800px; border:2px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#ECFFE4;text-align:center">Hallo</div>
<div style="margin:0; margin-right:800px; margin-left:0px; border:2px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#ECFFE4;text-align:center">Kannst du mir helfen?</div>
</div>

Vielen Dank schon mal im voraus! Lisa
 
Moin,

Dein HTML-Kasten ist ein div und das Zauberwort für das horizontale Ausrichten lautet float. Damit nach dem floaten alles wieder in "geregelten Bahnen läuft", das clearen nicht vergessen.

Grüße
low
 
Danke dir Low!
Aber eine Frage hätte ich noch: wie schreibe ich das Ganze dann? Etwa so?

<div style=
"float; margin:0; margin-right:1px; margin-left:800px; border:2px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#ECFFE4;text-align:center">jfjd</div>
<div style=
"float; margin:0; margin-right:800px; margin-left:0px; border:2px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#ECFFE4;text-align:center">jd</div>

und dann clear?

Bei mir hat sich nichts verändert :-(. Tut mir leid, dass ich solche grundlegenden Fragen stellen muss, aber ich hab schon überall gesucht und gestern acht Stunden dadran gesessen und alles ist immer wieder schief gegangen. Es wäre echt toll, wenn mir jemand das zeigen könnte, damit ich es endlich richtig habe!

Grüße, Lisa
 
Eher so:
HTML:
<div style="float:left;  margin:0; margin-right:1px; margin-left:800px; border:2px solid  #dfdfdf; padding: 0em 1em 1em 1em;  background-color:#ECFFE4;text-align:center">jfjd</div>
<div style="float:left;  margin:0; margin-right:800px; margin-left:0px; border:2px solid  #dfdfdf; padding: 0em 1em 1em 1em;  background-color:#ECFFE4;text-align:center">jd</div>
<div style="clear:left"></div>
float
clear
 
Ich hab es jetzt teilweise hingekriegt. Nur das Problem ist, dass sich die Kästchen vergrößern, wenn ich was reinschreibe und das will ich nicht. Hinzu kommt, dass wenn ein Kasten auf den anderen trifft, der eine sich wieder versetzt und das will ich ja auch nicht. Also was kann ich tun, damit die Kasten so bleiben wie sie sind? Ich wäre für jede Hilfe sehr dankbar, da mich diee Aufgabe noch ganz verrückt macht und in die Verzeweifelung treibt!
 
Ich meine ich möchte nicht, dass sich die Kästchen nach rechts oder links vergrößern, dafür habe ich ja eigentlich auch die Kästchen formatiert. Nach unten können sie natürlich größer werden.

Vielen Dank alogheo!
 
Zurück
Oben