New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[3.0.0RC1] input-group inside an inline form not aligning correctly #9382

Closed
siouf opened this Issue Aug 12, 2013 · 1 comment

Comments

Projects
None yet
2 participants
@siouf

siouf commented Aug 12, 2013

When appending an input-group to a form-inline, the input-group appears below the form on a "new line" instead of inline with the other controls.

This is because the input-group wrapper class has display set to table so that the child add-on span, which has display set to table-cell, can align properly.

Here is a live example: http://jsfiddle.net/26ZM4/2/

My knowledge of CSS is limited but I can't see a fix without using an additional wrapper that would contain the input-group as such:

.input-group-wrapper{
    display: inline-block;
    vertical-align: middle;
}

and the live fix: http://jsfiddle.net/26ZM4/3/

@mdo mdo closed this in f662dff Aug 12, 2013

@mdo

This comment has been minimized.

Show comment
Hide comment
@mdo

mdo Aug 12, 2013

Member

Thanks for calling this out—fixed the inline forms business by requiring the .form-group.

Member

mdo commented Aug 12, 2013

Thanks for calling this out—fixed the inline forms business by requiring the .form-group.

stempler pushed a commit to stempler/bootstrap that referenced this issue Apr 11, 2014

stempler pushed a commit to stempler/bootstrap that referenced this issue Nov 4, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment