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

button submit with search glyphe pulling off if < 540px #136

Open
englishextra opened this issue Feb 3, 2016 · 1 comment
Open

button submit with search glyphe pulling off if < 540px #136

englishextra opened this issue Feb 3, 2016 · 1 comment
Labels

Comments

@englishextra
Copy link

Resize the window on http://winstrap.azurewebsites.net/controls.html#navs

and watch out the search input with glyphed submit button

This is what I had to do:

.navbar-global .navbar-form{margin-top:10px;margin-bottom:0px;padding:0 10px 0 10px;}
.navbar-global .navbar-form .form-group{width:50%;}
.navbar-local .navbar-form{margin-bottom:0;padding:12px 10px 0 10px;}
.navbar-local .navbar-form .form-group{width:50%;}
.navbar-global .navbar-form .form-group,.navbar-local .navbar-form .form-group{display:inline-block;}
@media (min-width: 540px) {
    .navbar-global .navbar-form{margin-top:6px;margin-bottom:1px;padding:0 10px 0 10px;}
    .navbar-global .navbar-form .form-group{width:auto;}
    .navbar-local .navbar-form{margin-bottom:0px;padding:12px 10px 6px 10px;}
    .navbar-local .navbar-form .form-group{width:auto;}
}
@media (min-width: 1084px) {
    .navbar-global .navbar-form{margin-top:6px;margin-bottom:6px;padding:0 10px 0 10px;}
    .navbar-local .navbar-form{position:relative;top:4px;margin-top:-6px;margin-bottom:0;padding:20px 10px;}
}

See changes here https://englishextra.github.io/libs/englishextra-app/index.html

The key change is

.form-group{display:inline-block;}
@englishextra englishextra changed the title Fixing button submit with search glyphe pulling off when < 540px button submit with search glyphe pulling off when < 540px Feb 3, 2016
@englishextra englishextra changed the title button submit with search glyphe pulling off when < 540px button submit with search glyphe pulling off if < 540px Feb 3, 2016
@mlijanto mlijanto added the bug label Feb 5, 2016
@codefactorymx
Copy link
Contributor

Have submitted a fix MS guys, but meanwhile download my version here
https://github.com/codefactorymx/winstrap/tree/master/dist/css

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