-
-
Notifications
You must be signed in to change notification settings - Fork 78.8k
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
Button after input overlaps border in input group #24216
Comments
It looked better with the default Bootstrap button styles there 😁 |
I'll see what I can do. The |
@mdo you are right. This worked for me:
It might not be the most elegant but it proves that |
I have a similar issue not related to buttons, but I think the change in last comment will not work. Consider two text inputs in a line, first focused. Then if you hover over the second input the focus shadow on the first will be broken. https://codepen.io/alecpl/pen/PJgRob |
Hi @alecpl, Bootstrap does not support multiple form-controls in a single input group http://getbootstrap.com/docs/4.0/components/input-group/#basic-example @mdo I'm working on creating PR for this issue, but I need your help about z-index specifications. In normal state (not hovered/focused/actived), the following patterns are considered. Which one is the most preferable? |
The second one is most ideal. Apologies for the delayed response—missed this while I was out this last week on vacation. |
I have been considering this issue for a while and noticed further related subject. I will create a issue later. |
This will likely be addressed by #25020. |
#25020 merged, so closing. |
The simple solution for existing projects would be simply adding this rule: .form-control:focus
{
z-index: 9999;
position: relative;
} |
@mdo Are you sure about this recent change?
864c657
With light button background the missing border between input and following button seems strange to me, please see https://codepen.io/anon/pen/EwwmbK
When you hover or focus input, border is displayed.
The text was updated successfully, but these errors were encountered: