如何使div完全响应

Question

他试图通过在chrome inspect元素上检查多个响应来使此代码完全响应，但它不是完全响应，任何人都可以对其进行检查吗？、、、、、、、、、、、 、、、、、、、、、、、、、、、、、、、、、、、、、、、 、、、、、、、、、、、、、、、、、、、、、、、、、、、 、、、、、、、、、、、、、、、、、、、、、、、、、、、 、、、、、、、、、、、、、、、、、、、、、、、、、、、 、、、、、、、、、、、、、、、、、、、、、、、、、、、 、、、、、、、、、、、、、、、、、、、、、、、、、、、 ，

代码：

  <tr>
<td>
    <div class="form-group">
        <div class="col-xs-12 col-md-4">
            <form id="evidance_form" class="form-horizontal" method="POST" action="/goal/submitEvidance/<%=data._id%>" enctype="multipart/form-data">
                <input type="hidden" name="goal-evi" id="egoalId" value="<%= data._id %>">    
                <div class="form-row align-items-center">                           
                     <div id="periodDiv">
                         <div class="form-group goalPeriodDiv">
                             <div class="form-group-inside" style="display: flex; flex-wrap: wrap; margin-left: 80px;">
                                 <div class="input-group">
                                     <input type="text"
                                         class="form-control timepicker startTime add-on"
                                         name="description" placeholder="evidance" value="">
                                 </div>
                                 &nbsp; &nbsp;
                                 <div class="input-group">
                                     <input type="file"
                                         class="form-control timepicker startTime add-on"
                                         name="file" value="">
                                 </div>
                                 <div class="col-md-2 addRemBtn" style="margin-right: -500px;">
                                     <button  class="btn btn-primary fa fa-plus" id="submitBtn-evidance_form" style="margin-right: -100px;"></button>
                                 </div>
                             </div>
                         </div>
                     </div>
                 </div>
             </form>
         </div>   
         <div class="col-xs-12 col-md-4">
             <div class="form-group-inside" style="display: flex; flex-wrap: wrap; margin-left: 80px;">
                 <table>
                 <tbody>
                     <% data.evidance.forEach(function (evidance) { %>
                     <tr>
                         <% if (evidance.description) { %>
                         <td>
                             <div class="col-md-4">
                             <h4>
                                 <a href="#" id="goal_evidance" data-type="text" data-pk="<%= data._id %>~evidance~description" >
                                     <%= evidance.description %>
                                 </a>
                             </h4>
                         </div>
                     </td>
                     <% }else { %>
                     <% } %>
                     <!----------------------------->
                     <% if (evidance.attachment) { %>
                     <td>
                         <a href="/goal/download/<%=evidance.attachment%>">Download</a>
                     </td>
                     <td>
                         <a href="/goal/delete/<%= evidance._id%>/<%= data._id %>" class="btn btn-outline-danger my-2 my-sm-0">Delete</a>
                     </td>
                         <% }else { %>
                         <% } %>
                 </tr>
                 <% }) %>
             </tbody>
         </table>
     </div>  
 </div> 
 <div class="col-xs-12 col-md-4">
     <div class="form-group timePeriodDiv">
         <% if (isMentor ) { %>
             <a href="" id="evidance_feedback" data-type="textarea" 
  data-pk="<%= data._id %>~evidance~feedback" 
 data-placeholder="Enter Title-     Feedback..."  data-title="Teacher Comments"      
 class="editable editable-pre-wrapped editable-click soiComents">
                 <span><%= data.evidance[0].feedback %><i class="fa fa-comment m-l-sm"></i></span>
             </a>
         <% }else { %>
         <%= data.evidance[0].feedback %>
         <% } %>
          </div>
      </div>
   </div>
 </td>
 </tr>

Answer 1

首先，尝试将内联样式移动到单独的CSS文件中，以便使其在每个小工具中都具有响应能力。下一个级别是使用“媒体查询”来实现。见下面的链接：https://www.w3schools.com/css/css_rwd_mediaqueries.asphttps://www.w3schools.com/cssref/css3_pr_mediaquery.asp

希望有帮助...