This topic contains 1 reply, has 2 voices, and was last updated by Sean Sean 2 years, 4 months ago.

multi-select regions resize..


  • eunkorea
    Participant

    Posts: 2
    Member Reply #7520

    I want a big and regions.

    Let us know how you how to do it.

     

    *Please see the attached file.

    *source :

    <div class=”modal fade bs-modal-lg” id=”large” tabindex=”-1″ role=”dialog” aria-hidden=”true”>

    <div class=”modal-dialog modal-lg”>

    <div class=”modal-content”>

    <div class=”modal-header”>

    <button type=”button” class=”close” data-dismiss=”modal” aria-hidden=”true”></button>

    <h4 class=”modal-title”>Title</h4>

    </div>

     

    <div class=”modal-body”>

    <div class=”form-group last”>

     

    <div class=”col-md-12″>

    <select multiple=”multiple” class=”multi-select” id=”my_multi_select2″ name=”my_multi_select2[]”>

    <optgroup label=”NFC EAST”>

    <option>Dallas Cowboys</option>

    <option>New York Giants</option>

    <option>Philadelphia Eagles</option>

    <option>Washington Redskins</option>

    </optgroup>

    <optgroup label=”NFC NORTH”>

    <option>Chicago Bears</option>

    <option>Detroit Lions</option>

    <option>Green Bay Packers</option>

    <option>Minnesota Vikings</option>

    </optgroup>

    <optgroup label=”NFC SOUTH”>

    <option>Atlanta Falcons</option>

    <option>Carolina Panthers</option>

    <option>New Orleans Saints</option>

    <option>Tampa Bay Buccaneers</option>

    </optgroup>

    <optgroup label=”NFC WEST”>

    <option>Arizona Cardinals</option>

    <option>St. Louis Rams</option>

    <option>San Francisco 49ers</option>

    <option>Seattle Seahawks</option>

    </optgroup>

    </select>

    </div>

    </div>

    </div>

     

    <div class=”modal-footer”>

    <button type=”button” class=”btn dark btn-outline” data-dismiss=”modal”>닫기</button>

    <button type=”button” class=”btn green”>    등록    </button>

    </div>

    </div>

    <!– /.modal-content –>

    </div>

    <!– /.modal-dialog –>

    </div>

     

    • This topic was modified 2 years, 4 months ago by  eunkorea.
    Attachments:
    You must be logged in to view attached files.
    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #7535

    Hi,

    To customize the multiple select you can use below code in your custom.min.css:

    /* list container */

    .ms-container {

    width: 570px;

    }

     

    /* list group label */

    .ms-container .ms-optgroup-label {

    padding: 6px 0px 0px 15px;

    font-size: 16px;

    }

     

    /* list group item */

    .ms-container .ms-selectable li.ms-elem-selectable,

    .ms-container .ms-selection li.ms-elem-selection {

    padding: 6px 15px;

    font-size: 14px;

    }

    If you need any further clarifications please let us know.

     

You must be logged in to reply to this topic.