Elemente im <footer> untereinander statt übereinander

[FrankMe]

Hi,

ich habe einen footer und darin html-Elemente. Leider werden diese Elemente nebeneinander dargestellt, statt wie gewünscht untereinander.

Wie bekomme ich diese Elemente vertikal angeordnet?

Hier Beispielcode:

<footer>
   <div style="width: 150px; height: 40px; background-color: yellow; float: left;"></div>
   <div style="clear: both; width: 150px; height: 40px; background-color: blueviolet;"></div>
</footer>

Ich habe es auch (vergeblich) ohne float und clear versucht.

Frank

[beatovich]

hallo

Ich sehe nichts an deinem Code, was dein gewünschtes Verhalten stört. Browser Cache kann natürlich einen Streich spielen. Andernfalls ist zu testen, welche Regeln tatsächlich auf die Elemente angewendet werden. Siehe Browser Dev-Tools.

[basti1012]

Bei mir werden die auch untereinander angeordnet. Da wird wohl was andere drauf zugreifen du könntest es aber auch noch so versuchen

footer{ display:flex; flex-direction:column; }

[FrankMe]

Danke Basti! 😀

footer{ display:flex; flex-direction:column; }

ist meine Lösung.

Grüße! von Frank

[Auge]

Hallo

ich habe einen footer und darin html-Elemente. Leider werden diese Elemente nebeneinander dargestellt, statt wie gewünscht untereinander.

Wie bekomme ich diese Elemente vertikal angeordnet?

Indem du das float und clear weg lässt.

Hier Beispielcode:

<footer>
   <div style="width: 150px; height: 40px; background-color: yellow; float: left;"></div>
   <div style="clear: both; width: 150px; height: 40px; background-color: blueviolet;"></div>
</footer>

Ich habe es auch (vergeblich) ohne float und clear versucht.

Dann hast du noch etwas anderes, was du hier nicht zeigst, getan. Ohne float und clear sind Blockelemente wie deine divs einfach nur Blockelemente und werden, ihrer Natur entsprechend, untereinander dargestellt.

Tschö, Auge