Top Of Scrollable Element Is Hidden
I am working on a project including a table with scrollable cells. This may not look like the most elegant way to use a table, but this is what works for my use case. Unfortunate
Solution 1:
remove align-items:center
th{
border: black 5px solid;
}
th div{
display: flex;
justify-content: center;
overflow-y: auto;
padding: 5px;
width: 125px;
height: 125px;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<table>
<tr>
<th>
<div>
SAMPLE CONTENT1. SAMPLE CONTENT2. SAMPLE CONTENT3. SAMPLE CONTENT4. SAMPLE CONTENT5.
SAMPLE CONTENT6. SAMPLE CONTENT7. SAMPLE CONTENT8. SAMPLE CONTENT9. SAMPLE CONTENT10.
</div>
</th>
</tr>
</table>
</body>
</html>
Post a Comment for "Top Of Scrollable Element Is Hidden"