顯示剪輯的標題文本

Question

是否可以在懸停時全面顯示剪輯文本（overflow: hidden），以便其可讀。規則類似於

div:hover { 
    overflow: visible; 
    background-color: yellow; 
} 

導致文本顯示在另一個文本上，因此無法讀取任何內容。

這很難解釋，但容易看到：plunker。更改大小不是一種選擇。一個工具提示肯定會起作用，但我覺得它非常具有侵擾性。

一個問題：如何判斷給定的div內容是否完全顯示或剪切？

Answer 1

如果有可能，你可以試着改變你的風格像這樣

table { 
    border-collapse: collapse; 
} 

th, td { 
    border: 1px solid grey; 
    width: 100px; 
    height: 36px; 
    position: relative; 
} 

div { 
    width: 100px; 
    height: 36px; 
    overflow: hidden; 
} 

div:hover { 
    overflow: visible; 
    background-color: yellow; 
    position: absolute; 
    display:block; 
    height: auto; 
    top: 0; 
    z-index: 2; 
}