Ecommerce, SEO, Gadgets, Mac und Internet Themen

< input > Felder und Buttons identisch ausrichten

Kategorie: web-development Autor: Viktor Dite

Ich stoße schon seit längerem auf das Problem, dass Input Felder und nachfolgende (image) buttons sich nie auf einer Höhe befinden möchten. Auch wenn die Höher beider immer die gleiche ist, sie in einem fieldset zusammengeschlossen sind und das erste Element floatet.

ständig verrutschten mir die beiden Elemente »input Feld« und »button«

ständig verrutschten mir die beiden Elemente »input Feld« und »button«

Jetzt habe ich des Problems Wurzel gefunden. Ein input Feld wird standardmäßig mit vertical-align:middle; und ein button mit vertical-align:bottom; vom browser interpretiert.

Also muss ich nur entweder per CSS reset die Input Objekte »auf den Boden zurückholen« oder dem (image-) button gleiche mittlere Positionierung zuweisen und schon schaut das ganze heile aus!

angepasste Höhe beim input und Button Feld

angepasste Höhe beim input und Button Feld


Bewertungen für: < input > Felder und Buttons identisch ausrichten
1 Sterne2 Sterne3 Sterne4 Sterne5 Sterne (Keine Bewertungen bisher)
Loading ... Loading ...

Das könnte noch interessant sein:





Autor dieses Blogs
Viktor Dite bei Google+ Viktor Dite bei Twitter

Webworker & Blogger