Mike Mike - 2 months ago 6x
CSS Question

vertical-align isn't bringing my fields to the top of the DIV

I’m trying to align search fields. All my elements are within a parent container, which has the style

#statSearchFields {
vertical-align: top;
font-size: 90%;

The elements themselves have look like

<div class="searchField">
Start Date<br>
<input type="text" name="start_date" id="start_date" value="06/28/2014" placeholder="Start Date" class="datepicker hasDatepicker">

but when I put them in my container, they appear off-center. Here is the example fiddle — https://jsfiddle.net/n73ao02h/1/ . How do I bring everything into alignment?


You have to add vertical-align: top; to the .searchField selector.

Updated jsfiddle: https://jsfiddle.net/n73ao02h/2/