Moving elements in inline-block divs moves elements in opposite div
<p>I have 3 input fields and one of them I want a caption to go under. I have the input fields inside their own div and each divs are set to inline-block. As of now the middle input box raises higher than the left and right ones because of the caption below it. I am trying to push the input box down a little, but the other input boxes keep moving down with it, even though they're inside their own divs. I usually would do this with a table, but I am trying to understand divs more and positioning them. </p>

<p>Can someone please point me in the right direction? </p>

<p>I tried putting a child div in each and the input in each child div, and then setting the child div relative to the parent div, but it keep behaving the same way - each time I give a margin-top on either the div or the input field the other input fields move too, and nothing (that I know of) is set to make this happen other than defaulted this way.</p>