HTML Texte nebeneinander positionieren?
Ich erstelle zum ersten mal eine Website und bisher ging auch alles gut. Aber jetzt will ich zwei Texte nebeneinander haben. Aber wirklich etwas längere Texte, nicht nur eine Zeile oder so.
Dazu erstellt man doch eigentlich Container (mit div) oder? Ich dachte, dann richtet man den einen einfach nach rechts aus und schon geht das. Stimmt das? Geht das auch einfacher?
Und wie lautet dann der genaue Code/Quelltext?
4 Antworten
Das geht z.B. so:
Jo. EIne sehr schnelle Google-Suche erbrachte halt das als ersten Treffer.
Danke. Ich hab von CSS noch nicht viel Ahnung.
Heißt, ich schreibe die ganze Deklaration (Style usw) in <head> und der eigentliche Text kommt dann in den <body>?
Nimm Posting #5 und erstze jeweils das CONTENT1 und CONTENT2 durch deine Texte.
Wenn du generell noch nicht all zu gut bewandert bist, würde ich dir Bootstraps raten. Das ist ein CSS-Framework und macht alles "schöner", ohne dass du viel machen musst.
Bootstraps hat ein Grid system, womit du elemente direkt nebeneinander setzen kannst. Hie rkannst du auch angeben, wann die Elemente, die nebeneinander sind, untereinander angezeigt werden sollen (Handy).
https://getbootstrap.com/docs/4.0/layout/grid/
Ansonsten zählt, übern üben üben;)
float braucht man heutzutage nicht mehr nutzen, es gibt bereits einfachere und weitaus mächtigere Methoden, siehe:
https://css-tricks.com/snippets/css/a-guide-to-flexbox (dynamische Layouts)
und
https://css-tricks.com/snippets/css/complete-guide-grid (fixe Layouts)
Bevor du dich direkt mit CSS beschäftigst, solltest du HTML (Tags, Syntax und Semantik) auswendig kennen.
Die zwei von mir am häufigsten genutzten CSS-Webseiten :-D
In dem Fall würde aber CSS "columns" wohl ausreichen.
Hach, wie ich die Columns immer vergesse :D Danke für die Erinnerung!
Es gibt diverse Möglichkeiten, eine einfache ist die CSS-Anweisung "Columns":
https://css-tricks.com/almanac/properties/c/columns/
Das ist allerdings eher etwas für fortlaufende Texte.
Für 2 getrennte Spalten schau Dir mal die Antwort von [Name entfernt] an.
Ist machbar, aber technisch veraltet. Sowas macht man heutzutage besser mit CSS flex oder grid.