jQuery Mobile popup screen size

Question

I am using jQuery Mobile, I need a popup option for open a form. The popup is working, but I need to make it larger.

<div id="addPopup" data-role="popup" data-overlay-theme="a" data-theme="d" data-transition="pop" >

   <div data-role="header" data-theme="c" class="ui-corner-top">
        <div class="ui-btn-left">
            <a href="#NEED TO CONFIGURE" data-role="button" data-theme="c" data-icon="check" data-inline="true" data-ajax="false">Save</a>
        </div>

            <h1 class="ui-title" role="heading">Status</h1>

        <div class="ui-btn-right">
            <a href="#NEED TO CONFIGURE" data-role="button" data-theme="c" data-icon="delete" data-inline="true" data-ajax="false">Cancel</a> 
        </div>

        <div class="grid_10" style="text-align:left; width:30%; margin-top:0px;"> 
            <input type="text" name="name" id="name" value="" placeholder="Item Code">
        </div>
    </div>

How do I do this?

Answer 1

Use CSS to adjust the sizing of your popup.

#yourpopup{
    width: 200px;
}