Target popup container

Question

Я знаю, что это просто, но я не могу заставить его работать. У меня есть всплывающее окно, которое я хочу настроить и установить контейнер в полноэкранном режиме. Я могу настроить таргетинг на все всплывающие окна с помощью:

.ui-popup-container{ 
left:0px !important; 
width:100%; 
height:100% 
} 

Но я хочу только целевое конкретное всплывающее окно и попробовал:

#complete_pge_faultPop .ui-popup-container{ 
left:0px !important; 
width:100%; 

высота: 100% }

Целенаправленного всплывающее HTML :

<div data-role="popup" name="faultPop" dsid="faultPop" id="complete_pge_faultPop" 
     class="faultlist" data-corners="false" data-dismissible="false" data-overlay-theme="d" 
     data-theme="b" data-shadow="false" data-tolerance="4,4,4,4"> 
      <div class="ui-popup-content-wrapper"> 
       <!-- faultPop_grd --> 
       <div class="complete_pge_faultPop_grd_wrapper" data-wrapper-for="faultPop_grd"> 
        <table id="complete_pge_faultPop_grd" class="complete_pge_faultPop_grd" dsid="faultPop_grd" 
        name="faultPop_grd" cellpadding=0 cellspacing=0> 
         <col style="width:100%;" /> 
         <tr class="complete_pge_faultPop_grd_row_0"> 
          <!-- mobilegridcell_87 --> 
          <td id="complete_pge_mobilegridcell_87" name="mobilegridcell_87" class="complete_pge_mobilegridcell_87" 
          colspan=1 rowspan=1> 
           <div class="cell-wrapper"> 
            <!-- html_91 --> 
            <div data-role="appery_html" name="html_91" dsid="html_91" id="complete_pge_html_91" 
            > 
             <div style='width:100%;height:100%;padding-top:5;align:center'> 
              <fieldset data-role="controlgroup" data-mini="false" id="myGroup" style='padding:15px;'> 
               <legend> 
                Load Problem: 
               </legend> 
               <input id="radio-choice-1" type="radio" name="radio-choice" value="choice-1" data-theme="a" 
               style='padding:15px;' /> 
               <label for="radio-choice-1" data-theme="a"> 
                Damaged Pallet 
               </label> 
               <input id="radio-choice-2" type="radio" name="radio-choice" value="choice-2" data-theme="a" 
               /> 
               <label for="radio-choice-2" data-theme="a"> 
                Damaged Package 
               </label> 
               <input id="radio-choice-3" type="radio" name="radio-choice" value="choice-3" data-theme="a" 
               /> 
               <label for="radio-choice-3"> 
                Missing Goods 
               </label> 
               <input id="radio-choice-4" type="radio" name="radio-choice" value="choice-4" data-theme="a" 
               /> 
               <label for="radio-choice-4"> 
                Damaged Goods 
               </label> 
               <input id="radio-choice-5" type="radio" name="radio-choice" value="choice-5" data-theme="a" 
               /> 
               <label for="radio-choice-5"> 
                Other 
               </label> 
              </fieldset> 
              <label for="textarea-a" style='align:center;padding-left:10px;word-wrap:wrap;'> 
               Notes: 
              </label> 
              <textarea id="textarea-a" name="textarea" style='padding:5px;' placeholder='Add notes here these will appear on the customer paperwork.'></textarea> 
              <table style="height: 40px; width: 100%;" border="0" cellpadding="2" 
              align="center"> 
               <tbody> 
                <tr> 
                 <td> 
                  <button id="cancelbtn" data-theme="a" class="complete_pge_mobilebutton_79 ui-link ui-btn ui-btn-b ui-icon-back ui-btn-icon-right ui-btn-inline ui-shadow ui-corner-all ui-mini" 
                  data-corners="true" data-icon="back" data-iconpos="right" x-apple-data-detectors="false" 
                  data-inline="true" data-mini="true" data-theme="b" tabindex="17"> 
                   Cancel 
                  </button> 
                 </td> 
                 <td> 
                  <button id="faultSubbtn" data-theme="a" data-icon="back" class="complete_pge_mobilebutton_79 ui-link ui-btn ui-btn-b ui-icon-back ui-btn-icon-right ui-btn-inline ui-shadow ui-corner-all ui-mini" 
                  data-corners="true" data-iconpos="right" x-apple-data-detectors="false" data-inline="true" 
                  data-mini="true" tabindex="17"> 
                   Submit 
                  </button> 
                 </td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 

Как настроить таргетинг на всплывающее окно?

Спасибо за ваши предложения, я не смог добиться желаемого эффекта, я думаю, что мобильная оболочка JQuery, вероятно, имеет какое-то отношение. Я переосмыслию этот подход.

Answer 1

Я предполагаю, что DIV с ID #complete_pge_faultPop получает класс, который вы используете, так что вам нужен правильный CSS каскад:

#complete_pge_faultPop.ui-popup-container{ 
    /* note how there is no space between the two selectors, this means they must be both on the same element */ 
}