Nếu nội dung bị tràn, thì giải pháp cho trànX thuộc tính để giải quyết các vấn đề về cạnh trái / phải và thiết lập một cuộn. Thêm một cuộn cho phép khách truy cập dễ dàng đọc toàn bộ nội dung.
Ví dụ
Bạn có thể thử chạy đoạn mã sau để tìm hiểu những gì cần thực hiện với các cạnh trái / phải của nội dung bị tràn JavaScript -
<!DOCTYPE html>
<html>
<head>
<style>
#box {
width: 350px;
height: 150px;
background-color: orange;
border: 3px solid red;
white-space: nowrap;
margin-left: 20px;
}
</style>
</head>
<body>
<p>Click to use overflow property and set scroll.</p>
<button type="button" onclick="display()">Set Scroll</button>
<div id="box">
<p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
<p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
<p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
<p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
<p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
<p>This is a div. This is a div. This is a div. This is a div. This is a div.</p>
</div>
<br>
<br>
<script>
function display() {
document.getElementById("box").style.overflowX = "scroll";
}
</script>
</body>
</html>