2015-05-07 62 views
0

我使用Bootstrap 3,並且在iFrame或任何內容中存在表問題。我希望將iFrame內容視爲頁面的一部分。
我已經刪除了iFrame邊框,以便清楚。Bootstrap 3:iFrame內部的響應表

因此,例如,如果iFrame的寬度爲1000像素,則內容內頁面寬度也應爲1000px @ 100%。

我使用的引導3.

enter image description here

正如你所看到的例子,內嵌框架有一個滾動條,因爲它認爲它的頁面大小爲1920的寬度。

<?php if(login_check($mysqli)==true): ?> 
<body> 
<div class="row-fluid"> 
    <div class="col-md-4"> 
     <h3>Clients</h3> 
    </div> 
    <div class="col-md-8"> 
     <select> 
      <option value="name">First Name</option> 
      <option value="surname">Surname</option> 
      <option value="company">Company</option> 
      <option value="date">Date</option> 
     </select> 
    </div> 
    <div class="col-md-12"> 
     <table id ="example" class="table table-striped table-bordered"> 
      <thead> 
       <tr> 
        <th>Account</th> 
        <th>Name</th> 
        <th>Surname</th> 
        <th>Phone</th> 
        <th>Unit</th> 
        <th>Street</th> 
        <th>type</th> 
        <th>Suburb</th> 
        <th>Date</th> 
       </tr> 
      </thead> 
      <tbody> 
      <?php 
      $clients_list = "SELECT * FROM clients_table"; 
      $details = $mysqli->query($clients_list); 
      while($row = mysqli_fetch_array($details)) { 
       echo ' 
        <tr> 
         <td><input type="text" value="'.$row['_account'].'" id="_account'.$row['_account'].'" readonly="readonly"/></td> 
         <td><input type="text" value="'.$row['_first'].' " id="_first'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_surname'].'"id="_surname'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_phone'].'"id="_phone'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_unit'].'" id="_unit'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_street'].'" id="_street'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_type'].'" id="_type'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_suburb'].'"id="_suburb'.$row['_id'].'"/></td> 
         <td><input type="text" value="'.$row['_email'].'"id="_email'.$row['_id'].'"/></td> 
        </tr>'; 
      } 
      ?>   
      </tbody> 
     </table>               
    </div> 
</div> 

回答

1

這是在bootstrap.css中的代碼

請試試看。

.table-responsive { 
    min-height: .01%; 
    overflow-x: auto; 
} 
@media screen and (max-width: 767px) { 
    .table-responsive { 
    width: 100%; 
    margin-bottom: 15px; 
    overflow-y: hidden; 
    -ms-overflow-style: -ms-autohiding-scrollbar; 
    border: 1px solid #ddd;  
    } 
-2

據我所知,如果在你的iframe中加載的頁面是響應,那麼你將沒有任何問題。

因此,如果您將高度&設爲100%,那麼它將完全適合iframe,使其看起來像您主要網頁的一部分。