html - Vertical alignment multiple spans inside div with variable height (ui-select-multiple) -

-

i use multiselect angularjs ui-select.

my multiselect looks http://plnkr.co/edit/zjruw8stsglrj38ivwhi?p=preview

spans can arranged in multiple lines if there many. want nice vertical aligment this.

i managed 1 line:

http://cs630525.vk.me/v630525759/14770/wc2j1zbmx9e.jpg

but fails on multiple lines:

http://cs630525.vk.me/v630525759/14777/wudetojrvx0.jpg http://cs630525.vk.me/v630525759/1477e/27qtejdqlam.jpg

"nice vertical aligment" - paddings same colors must equal

http://cs630525.vk.me/v630525759/147d8/yzbfrsigxl8.jpg

html

  <ui-select multiple class="ui-select-container ui-select-multiple ui-select-bootstrap form-control dropdown"               ng-model="multipledemo.colors" ng-disabled="disabled">       <ui-select-match class="ui-select-match" placeholder="select colors...">{{$item}}</ui-select-match>       <ui-select-choices repeat="color in availablecolors | filter:$select.search">         {{color}}       </ui-select-choices>   </ui-select>

css

.ui-select-multiple.ui-select-bootstrap {   padding: 0 3px;   min-height: 34px;   height: auto;   width: 300px; }  .ui-select-match {   display: inline;   vertical-align: baseline; }  .ui-select-multiple.ui-select-bootstrap input.ui-select-search {   min-height: 32px;   margin: 0; }  .ui-select-multiple.ui-select-bootstrap > div {   min-height: 32px; }  .form-control {   display: block;   width: 100%;   height: 34px;   padding: 6px 12px;   font-size: 14px;   line-height: 1.42857143;   color: #555;   background-color: #fff;   background-image: none;   border: 1px solid #ccc;   border-radius: 4px; }

how can this?

add below code css 

.ui-select-multiple.ui-select-bootstrap .ui-select-match-item {     display:block;  }

Comments

Post a Comment

Popular posts from this blog

Hatching array of circles in AutoCAD using c# -

-
i beginner in autocad plugins .i have created array of circle using following code. now, have hatch circles in array .how that??how hatch circles @ once? moreover, how can return hatch method , use hatch objects.sorry language.thanks in advance. [assembly: commandclass(typeof(beamsection.class1))] namespace beamsection { public class class1 { //class1 obj = new class1(); [commandmethod("beamatsupport")] public void addlightweightpolyline() { // current document , database document acdoc = application.documentmanager.mdiactivedocument; database accurdb = acdoc.database; promptpointresult ppr = acdoc.editor.getpoint("\nselect starting point "); var ucs = acdoc.editor.currentusercoordinatesystem; point3d startingpt = ppr.value.transformby(ucs); list<double> radius = new list<double>(); radius.add(0.5); ...
Read more

ios - UITEXTFIELD InputView Uipicker not working in swift -

-
hello trying pop uipickerview view programmatically when user clicks on textfield. have tried doesn't doing anything. isn't working. nothing happening when click textfield class userprofiletableviewcontroller: uitableviewcontroller,uitextfielddelegate,uipickerviewdelegate,uipickerviewdatasource { var itempicker: uipickerview! = uipickerview() @iboutlet weak var gendertxtfield: uitextfield! var gender = ["male","female"] override func viewdidload() { super.viewdidload() gendertxtfield.delegate = self itempicker!.delegate = self itempicker!.datasource = self itempicker!.backgroundcolor = uicolor.blackcolor() self.gendertxtfield.inputview = itempicker } func numberofcomponentsinpickerview(pickerview: uipickerview) -> int{ return 1 } // returns # of rows in each component.. func pickerview(pickerview: uipickerview, numberofrowsincomponent component:...
Read more