Ajuster la table en div sans faire défiler

Question

J'essaye d'adapter une table (tblCharts) dans un autre div (graphiquesDiv) et pour enlever le défilement vertical. Mon code actuel est

<div class="row" style="padding-top:0px; margin-top:0px; margin-right:0px; border:groove; height:610px; overflow:auto" id="graphsDiv"> 

</div> 

Sur chargement de la page

$(function(){ 
    var tableHTML = '<table id="tblCharts" style="width:100%; height: 100%; ">'; 
    for (var j = 0; j < rows; j++) { 

     tableHTML += '<tr>'; 

     for (var k = 0; k < cols; k++) { 
      tableHTML += '<td id="td style="border:none;"><div id="chart' + j + k + '" ></div></td>'; 
     } 
     tableHTML += '</tr>'; 
    } 
    tableHTML += '</table>'; 

    $('#graphsDiv').append(tableHTML); 
}); 

l'intérieur de chaque div chartjk il y a un tableau chargé par la suite. La capture d'écran actuelle est jointe.

Si je change la hauteur graphsDiv, à 100%, il déborde son propre conteneur ..

<div id="graphsWindow"> 
    <div class="table"> 
     <div class="row" style="margin-left:0px;margin-top:0px; padding-top:0px; padding-bottom:0px"> 
     <div style="border:groove; margin-left:10px; margin-bottom:0px; padding-bottom:0px; margin-right:2px" class="col-md-2"> 
     </div> 
     <div class="col-md-9" style="padding-bottom:0px; padding-top:0px; margin-top:0px; margin-left:15px;"> 
      <div class="row" style="padding-top:0px; margin-top:0px; margin-right:0px; border:groove; height:610px; overflow:auto" id="graphsDiv"> 

      </div>   
     </div> 
    </div> 
    </div> 

Answer 1

Il y a un problème ici

'<td id="td style="border:none;"><div id="chart' 

L'ID n'a pas fermé ", donc cela vaut la peine de fixer En outre, pourriez-vous partager toute la page, par exemple dans un jsfiddle En général, si vous voulez arrête de défiler en cours d'utilisation use overflow-y: hidden. Cela dit, je pense qu'une meilleure solution pourrait être trouvée si je peux voir toute la page.