custom-control + custom-control margin-left break display on mobile view
Closed this issue · 0 comments
Tested on Windows, Firefox 45.2 ESR, IE11 and Chrome 54
Onto the doc page : http://v4-alpha.getbootstrap.com/components/forms/#radios
The custom-controls display well on desktop, but when switching to mobile view, the margin-left into _custom-forms.scss push the second custom-control block.
Maybe it's better to put a margin-right onto each custom-control. But warning fo RTL maybe need to be reverted.
.custom-control {
position: relative;
display: inline-block;
padding-left: $custom-control-gutter;
cursor: pointer;
- .custom-control {
margin-left: $custom-control-spacer-x;
}
}
Display with the margin-left on mobile view :
Display with the margin-right
The other option (maybe not really robust), will be to remove the margin if viewport is lower than a fixed breakpoint?
Say to me if you want a pull-request