Bootstrap input group with select as add-on -


Whatever I try, I can not get input as an option with a selector.

What do I want here:

Enter image details here

However, I can not seem to do this work by following the Bootstrap guide for the input group:

  & lt; Div class = "input-group" & gt; & Lt; Input type = "text" class = "form-control" /> & Lt; Select class = "form-control input-group-add-on" & gt; & Lt; Options & gt; Item 1 & lt; / Options & gt; & Lt; Options & gt; Item 2 & lt; / Options & gt; & Lt; / Select & gt; & Lt; / Div & gt;  

Can someone help me? I'm searching for a while!

You can make changes by adding custom styles.

I added a square to "Input-group" named "Selection-group" and targeted the input field and chose.

HTML

  & lt; Div class = "input-group selection-group" & gt; & Lt; Input type = "text" class = "form-control" /> & Lt; Select class = "form-control input-group-add-on" & gt; & Lt; Options & gt; Item 1 & lt; / Options & gt; & Lt; Options & gt; Item 2 & lt; / Options & gt; & Lt; / Select & gt; & Lt; / Div & gt;  

CSS

 . Selection-group input Format-Control {Width: 65%} Select Selection-group Input-group-addon {width: 35%; }  

demo


Comments