2017-05-23 5 views
0

Bootsrap ansprechende Tabelle wie folgt arbeiten:Bootsrap ansprechende Tabelle funktioniert nicht in Haupttabelle td Zelle

<div class="table-responsive"> 
<table class="table"><tr><td>responsive working</td></tr></table> 
</div> 

Aber wenn ich in einer Haupttabellenzelle verwendet (td) Innen ansprechende Tabelle funktioniert nicht. Was können wir tun, um es zu reparieren?

<table> 
<tr> 
<td> 

<div class="table-responsive"> 
<table class="table">now not responsive</table> 
</div> 

</td> 
</tr> 
</table> 
+0

warum anderen Tisch in einer Tabelle sein? – Swellar

+0

@Swellar Sie sind Recht divs nützlich stattdessen Tabellen für Front-Website, aber dies ist für Admin-Panel. Tafeln alte Gewohnheiten für mich und es ist einfach für mich anstelle von divs. Ich benutze erste Tabelle für Haupt-Box (erste tr für Modul-Titel und zweite tr für Modul Inhalt etc ..) – webmaster

Antwort

1

Sie so etwas tun kann, das Problem war, dass man keine Standardtabellenklasse angegeben haben, die mit Bootstrap kommt „table“ Sie haben es zuerst zu nennen. Nicht table-responsive, muss es table table-responsive

<html> 
 
<head> 
 
<head> 
 
    <title>Bootstrap Example</title> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
    <meta charset="utf-8"> 
 
</head> 
 
<body> 
 
<table class="table table-responsive"> 
 
    <th colspan="3">Outer Table</th> 
 
    <tr> 
 
    <td>This is row one, column 1</td> 
 
    <td>This is row one, column 2</td> 
 
    
 
    <td> 
 
     <table class="table table-responsive"> 
 
     <th colspan="3">Second Inner Table</th> 
 
     <tr> 
 
      <td>This is row one, column 1</td> 
 
      <td>This is row one, column 2</td> 
 
      <td>This is row one, column 3</td> 
 
     </tr> 
 
     </table> 
 
    </td> 
 
    </tr> 
 
</table> 
 
    
 

 
</body> 
 
</html>

+0

danke für die Antwort, ich habe versucht, es in meinem Code zu beheben, aber reagiert nicht funktioniert (Bildlaufleiste nicht gekommen) i werde mit deinem ganzen Code auf der neuen Seite versuchen. – webmaster

+0

Ich habe viel Kombination versucht, aber nicht funktioniert, können Sie das sehen? https://codepen.io/anon/pen/zwyaJX – webmaster

+0

@webmaster jetzt überprüfen Sie diese https://codepen.io/anon/pen/pPqKmx Sie haben hinzugefügt unnötige divs – AVI

Verwandte Themen