Placing select box inside footer bar

ionic-v1
1

im trying to place a select box inside a footer bar, however the styling is not quite right. the width is static and is scrunched up. I need it to be 100% of the footer. any ideas what im doing wrong? I used the header input documentation as a reference, and I was able to get a search form with a button to work fine, however I need a select box.

<div class="bar bar-footer bar-light item-input-inset">
  <label class="item item-input item-select">
    <div class="input-label">
      Lightsaber
     </div>
     <select>
       <option>Blue</option>
       <option selected>Green</option>
       <option>Red</option>
     </select>
   </label>
</div>

any help would be great, thanks

2

Hi @stonepreston, you could add

.bar-footer label {
  width: 100%; }

to your CSS. Ionic is a starting point.

3

thanks! that worked perfectly. guess I should have tried messing with css first, just thought that since all the other inputs worked fine maybe I was structuring it wrong