Question about creating an "inline form"

[ddankwerth]

Actual Behavior:

• What is the issue? * Cant create an inline form (e.g. as a row)
• What is the expected behavior? a bit like Bootstrap inline form

CodePen (or steps to reproduce the issue): *

• CodePen Demo which shows your [issue:](http://codepen.io/anon/pen/rjYXOK)
• Details: Example of a row with dropdown + input + button , alignment is wrong

Angular Versions: *

• Angular Version: any angular version
• Angular Material Version: latest (1.1.1)

Additional Information:

• Browser Type: * Chrome
• Browser Version: *
• OS: *windows
• Stack Traces:

---

Shortcut to create a new CodePen Demo.
Note: * indicates required information. Without this information, your issue may be auto-closed.

Do not modify the titles or questions. Simply add your responses to the ends of the questions.
Add more lines if needed.

[ddankwerth]

I got a comments saying :
Its just the layout-margin on the body tag that causes that issue. See: http://codepen.io/anon/pen/zNRMoB
However, the "inline form" is still not aligned properly, that's because while the md-input-containers are all the same (size, margin padding... ) the content is different and aligned differently , the md-select is 30 while the md-button is 36 ... how can I get them aligned to the bottom so they looks like a unified inline form ?

[Splaktar]

The problem that you are raising here is only that the button isn't aligned with the top/bottom of the input and select in your demo?

They don't put buttons inline, but the input examples on the docs site (https://material.angularjs.org/latest/demo/input) show some examples of inline style forms.

In your example, you put the button inside of an md-input-container which is not meant for holding buttons. If I just change that to a div, then the alignment seems pretty good. See updated CodePen. If you wanted to make more alignment tweaks, then custom CSS should be able to accomplish this quite easily.