Question

我必须创建一个模态窗口，其中包含动态评估的输入字段（每次用户点击输入时，都会添加一个新输入）。我的问题是模态的背景并没有根据模态的大小扩展

HTML的一部分：

<div class="modal fade edit-profile modal-profile" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
        <!-- modal-content -->
        <div class="modal-content">
            <div >
                <!-- demo-tabs-vertical -->
        <div id="demo-tabs-vertical people" class="tabbed-nav-flat clearfix edit-tab hover clean medium flat-peter-river flat z-icons-light z-rounded z-bordered z-spaced z-tabs vertical top-left top" data-options="{&quot;orientation&quot;: &quot;vertical&quot;, &quot;style&quot;: &quot;clean&quot;, &quot;size&quot;:&quot;medium&quot;, &quot;position&quot;: &quot;top-left&quot;, &quot;rounded&quot;:true,&quot;spaced&quot;:true, &quot;theme&quot;:&quot;flat-peter-river&quot;}">
                    <ul class="z-tabs-nav z-hide-menu tab-menu">
                        <li class="z-tab z-first z-active" onclick="javascript:validTab(event)" data-link="tab1" data-form="#basicInfoForm">
                            <a class="z-link">Basic Information</a>
                        </li>
                        <li class="z-tab" data-link="tab2" onclick="javascript:validTab(event)" data-form="#colorThemeForm">
                            <a class="z-link">Colour Theme</a>
                        </li>

                        <li class="z-tab" data-link="tab4" onclick="javascript:validTab(event)" data-form="#personalExpertiseForm">
                            <a class="z-link">Personal Expertise</a>
                        </li>
                        <li class="z-tab" data-link="tab5" onclick="javascript:validTab(event)" data-form="#pro-exp">
                            <a class="z-link">Professional  Experience</a>
                        </li>

                    </ul>

模态对话框中其中一个选项卡的输入元素示例：

   <div id="tab4" class="z-content personal-expertise">
                  <div class="z-content-inner">
                    <h3 class="title-heading">Personal Expertise</h3>
                    <form name="personalExpertiseForm" id="personalExpertiseForm" >
                      <div class="form-group clearfix">
                        <label>Tourism types</label>
                       <div class="field-input dropdown-input">
                                                <div class="field-group deleteable">
                            <input type="text" tabindex="1" class='signup-input' id="marketSegments" search="/threebaysover/tags/searchCompanyTags?realm=company.speciality" pre="[{&quot;class&quot;:&quot;com.threebaysover.meta.TourismSegment&quot;,&quot;id&quot;:2,&quot;name&quot;:&quot;Adventure Travel&quot;},{&quot;class&quot;:&quot;com.threebaysover.meta.TourismSegment&quot;,&quot;id&quot;:12,&qquot;name&quot;:&quot;Domestic Tourism&quot;},{&quot;class&quot;:&quot;com.threebaysover.meta.TourismSegment&quot;,&quot;id&quot;:17,&quot;name&quot;:&quot;Familiarisation Tours&quot;},{&quot;class&quot;:&quot;com.threebaysover.meta.TourismSegment&quot;,&quot;id&quot;:43,&quot;name&quot;:&quot;Safari Holidays&quot;},{&quot;class&quot;:&quot;com.threebaysover.meta.TourismSegment&quot;,&quot;id&quot;:44,&quot;name&quot;:&quot;Sailing Holidays&quot;}]" name="" placeholder="Start typing to see list">

                        </div>
                        </div>
                        <p>Select max. 5 types of tourism that you're an expert in.</p>
                      </div>

问题仅发生在小于15英寸的屏幕上

模态对话框 - 如何通过滚动使模态的背景延伸100％？

0 个答案: