Пользовательский стиль для JQuery 'Selectmenu'

Question

Я получил «Выбрать местоположение» с сайта jQuery, но мне нужна фиксированная ширина и высота для кнопки. Выпадающая кнопка должна иметь стиль 150px и высоту 46px.

Я не могу заставить его работать при редактировании в CSS.

Вот мой текущий код:

$(function () {
    $("#locationSelection")
        .selectmenu()
        .selectmenu("menuWidget")
        .addClass("overflow");
});

fieldset {
  border: 0;
}

label {
  display: block;
  margin: 30px 0 0 0;
}

.overflow {
  height: 200px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div class="form-group">
    <div class="col-lg-6 col-md-6">
        <div class="Location">
            <form id="forLocation" action="#">
                <fieldset>
                    <label for="locationSelection">Location</label>
                    <select name="locationSelection" id="locationSelection">
                        <option value="PR" selected="selected">Prishtine</option>
                        <option value="PZ">Prizren</option>
                        <option value="PD">Podujeve</option>
                        <option value="GI">Gjilan</option>
                        <option value="PJ">Peje</option>
                    </select>
                </fieldset>
            </form>
        </div>
    </div>
</div>

Answer 1

Вот обновленный jsfiddle для него - https://codepen.io/soniaj204/pen/zVeZOo

#locationSelection-button {
  width: 150px;
  height: 46px;
  box-sizing: border-box;
  line-height: 32px;
}


.ui-button .ui-icon {
  top: 10px;
}