Tablonun yüksekliğini dikey kaydırma çubuğu belirecek şekilde nasıl belirtebilirim?

Question

Sayfamda birçok satırı olan bir tablom var. Tablonun yüksekliğini 500px için söyleyeyim, tablonun yüksekliği bundan daha büyük olursa, dikey bir kaydırma çubuğu görünecektir. CSS height özniteliğini table üzerinde kullanmayı denedim, ancak çalışmaz. Tabloyu başka bir öğenin içine sarmanız ve o öğenin yüksekliğini ayarlamanız gerekir.

Answer 1

overflow CSS özelliğini kullanmayı deneyin. Sadece yatay taşmanın (overflow-x) ve dikey taşmanın (overflow-y) davranışını tanımlamak için ayrı özellikler de vardır.

yalnızca dikey kaydırma istediğim için

, şunu deneyin:

table { 
    height: 500px; 
    overflow-y: scroll; 
} 

---

DÜZENLEME:

Görünüşe <table> elemanları overflow özelliğini saygı göstermiyorlar. Bu, <table> öğelerinin varsayılan olarak display: block olarak oluşturulmadığından (gerçekte kendi görüntüleme türüne sahip oldukları için) sahip oldukları görülmektedir. Bir blok tipi olmak <table> elemanı ayarlayarak çalışmak overflow özelliğini zorlayabilirsiniz:

table { 
    display: block; 
    height: 500px; 
    overflow-y: scroll; 
} 

Not bu% 100 genişliğe sahip eleman neden olacağını, bu nedenle yukarı çekmek için istemiyorsanız Sayfanın tüm yatay genişliğinde, eleman için de açık bir genişlik belirtmeniz gerekir.

Answer 2

Örnek satır içi örnek:

<div style="height: 500px; overflow: auto;"> 
<table> 
</table> 
</div>