HTML: Yan yana olmaları durumunda tabloların toplam yüksekliğini nasıl artırırım?

Question

Aşağıdaki tabloyu yan yana yerleştirmek için aşağıdaki kılavuzu (https://stackoverflow.com/a/45672648/2402577) takip ettim. Çıktı tablolarının yükseklikleri simetrik olmadığından ve her iki tablonun yüksekliğini değiştiremediğimden (tabloların görüntülenen satır sayısını artırmak için daha uzun bir tabloya sahip olmayı tercih ediyorum).

Benim kaynak kodu, ben Bootstrap kullanıyorum unutmayın:

<div class="container" id="coverpage">                              
    <div class="row">                                   
    <div class="col-md-6 col-sm-12">                           
    <table id="tableblock" class="display"><caption><h3 style="color:black;">Latest Blocks</h3></caption></table>   
    </div>                                      
    <div class="col-md-6 col-sm-12">                           
    <table id="tabletxs" class="display" ><caption><h3 style="color:black;">Latest Transactions</h3></caption></table>  
    </div>                                      
    </div>                                      
</div> 

Çıktı:

ilk tablonun görüntülenen satır numarasını görebileceğiniz gibi bu 5 olmalıdır orijinal 2. (olduğu <div class="col-md-6 col-sm-12"> yorum yaptığımda.

[Q] Her iki tablonun genel yüksekliğini nasıl daha büyük hale getirebilirim (görüntülenecek satır sayısını artırın) ve her iki tabloyu simetrik hale getirebilirim?

Değerli zamanlarınız ve yardımlarınız için teşekkür ederiz.

Answer 1

için height = "100 piksel"

Simmilarly, ben hatamı anladım. scrollY: değerini artırdığımda, $(document).ready(function()) altında tanımlanan sorunumu çözdü.

Örnek:

$(document).ready(function() { 
    $.get("btabl", function(result){ 
     $('#tableblock').DataTable({ 
     data: result, 
     scrollY: 800, //I increased this value. 
     paging: false, 
     info: false, 
     searching: false, 
     order: [[ 0, "desc" ]], 
     columnDefs: [ 
      { 
       targets: [0,1], 
       render: function (data, type, row, meta) { 
        if(type === 'display'){ 
         data = " " + data ; 
         data = data.replace(/(@@(.+)@@)/,'<a onClick="a_onClick(' + "'" + "$2" + "'" + ')">' + "$2" + '</a>') ; 
         // data = '<a onClick="a_onClick(' + "'" + encodeURIComponent(data) + "'" + ')">' + data + '</a>'; 
         // data = '<a href="search/' + encodeURIComponent(data) + '">' + data + '</a>'; 
        } 

        return data; 
       } 
      }, 
      {className: "dt-center", "targets": [0,1,2,3]} 
     ], 
     columns: [ 
      { title: "Block" }, 
      { title: "Mined By" }, 
      { title: "Time" }, 
      { title: "Txs" } 
     ] 
     }) 
    }) 
}) ; 

Answer 2

CSS 'da yükseklik ve genişlik özelliğini kullanabilirsiniz. tablo etiketinde: İkinci tabloda

Answer 3

iyi Eğer db LatestBlocks Tablo ızgara yapı halinde jquery dakika olduğu yükseklikte özelliğini ayarlamak.

veya ilk tablonun yüksekliği O yardımcı olmadı