Skip to content
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

Enable support of input groups within button groups #10921

Closed
SmithSamuelM opened this issue Oct 2, 2013 · 5 comments
Closed

Enable support of input groups within button groups #10921

SmithSamuelM opened this issue Oct 2, 2013 · 5 comments
Labels
Milestone

Comments

@SmithSamuelM
Copy link

BS3 use of display: table and table-cell breaks btn-toolbars. Using an input as part of an input group inside of a btn-toolbar always forces any following btn-groups to wrap to the next line. It appears to be a problem with using display: table

To fix it I had to revert to using display: inline-block for input groups and then adjusting the horizontal spacing.

It may seem like a good idea to use display: table-cell to get horizontal elements to snug up to each other but it breaks btn-toolbars and so is a bad choice unless you also fix up everthing else to work with display: table and table-cell. This is a regression from the behavior of BS2 and should be fixed.

@cvrebert
Copy link
Collaborator

cvrebert commented Oct 2, 2013

Would you mind posting an example?

@SmithSamuelM
Copy link
Author

ok

@cvrebert
Copy link
Collaborator

@SmithSamuelM Well?

@SmithSamuelM
Copy link
Author

Sorry I got pulled of onto another project. Since I fixed up my stuff to work around. I have to go back and undo my fixes to recreate it. it so its not a simple copy and paste. Try to get to it this week.

@mdo mdo closed this as completed in 544b8ec Dec 15, 2013
@mdo
Copy link
Member

mdo commented Dec 15, 2013

Demo of fix coming in v3.1: http://jsbin.com/aGEcUqAT/1/.

@mdo mdo mentioned this issue Dec 15, 2013
stempler pushed a commit to stempler/bootstrap that referenced this issue Apr 11, 2014
…oolbars

* Floats any `.input-group` within a toolbar
* Simplifies the CSS to remove sibling selectors and instead use a
negative amrgin on the parent with only `margin-left`

See it in action: http://jsbin.com/aGEcUqAT/1/.
stempler pushed a commit to stempler/bootstrap that referenced this issue Nov 4, 2014
…oolbars

* Floats any `.input-group` within a toolbar
* Simplifies the CSS to remove sibling selectors and instead use a
negative amrgin on the parent with only `margin-left`

See it in action: http://jsbin.com/aGEcUqAT/1/.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants