Report

Добрый день. 
Помогите решить проблемку. В chrom и Opera
<select>
<option>100g</option>
</select>
у g обрезаeтся хвостик. 
 

Здравствуйте, дорогие форумчане. Я - новичок самоучка, поэтому для вас проблема может быть не очень сложная.
Мне нужно сделать выпадающий список, как на рисунке. Интересует меня то, как сделать такие оглавления, как на изображении ("по сторам", "по товару"), чтоб они не выпадали вместе с option. 
Простите, если не совсем понятно и корректно выражаюсь!

В корзине динамически формируется выбор вариантов доставки, из которого должен выбираться пункт выдачи. но событие клика на варианте доставки не срабатывает
для проверки работы нужно что-то положить в корзину, например https://www.road.media/avtomagnitoly/ford/5861-detail
собственно, корзина: https://www.road.media/cart
После клика на первом варианте (пункт выдачи СДЕК), должен раскрыться список пунктов выдачи (город у каждого будет свой, определяется автоматически по России):

За раскрытие списка и обработку дальнейшего выбора пункта выдачи отвечает файл https://www.road.media/plugins/vmshipment/transportadoras/cdek_script.js
Выглядит он так:
jQuery(document).ready(function ($) { $('.cdek_shipment').on("click", function () { var $ship_id = $(this).attr("data-id"); var $ship_pvz = $(this).attr("data-pvz"); var $ship_map = $(this).attr("data-map"); console.log('Выбран вариант доставки'); $(this).first(".cdek_outpost_list").slideToggle(); }); var $notator = $("#customer_note_field"); var $pvz_map = $("#map"); $(".cdek_outpost_list input").on("change", function () { var $pvz = $(this); console.log('PVZ выбран'); $notator.empty().append("Заберу по адресу:" + $pvz.attr("data-address")); if ($pvz_map.length > 0) { // карта существует, предполагаем что можем выводить в нее console.log("map exists"); } }); }); .cdek_shipment создаётся другим скриптом уже после загрузки страницы, я на это повлиять не могу.
Более того, каждый раз при смене города, блок с вариантами доставки создаётся заново.
Где я ошибся? Помогите разобраться, пожалуйста.
UPD:
Нашел как перенавесить событие. теперь другой вопрос
$("#ajaxshipping").on("click", '.cdek_shipment', function () { // как тут получить объект .cdek_shipment для манипуляций? )};  

<select> <option disabled>Имя  Фамилия  №телефона</option> <option>Андрей Мартыненко 123456789</option> <option>Кирил Богун 123321456</option> <option>Игорь Лях  258852123</option> </select> выводит:
Имя  Фамилия  №телефона
Андрей Мартыненко 123456789
Кирил Богун 123321456
Игорь Лях  258852123
а нужно с выравниванием каждой колонки:
Имя       Фамилия        №телефона
Андрей  Мартыненко  123456789
Кирил    Богун              123321456
Игорь    Лях                  258852123
пока спасаюсь анализом длины в php скрипте и добавлением &nbsp; тоесть своей функцией выравнивания,
но может есть более простой метод, HTML5 свойство, или CSS

Здравствуйте.
Подскажите хороший плагин кастомного селекта и таким же кастомным скроллом. Желательно 2 в 1. Ну или посоветуйте, как объединить.