CSS ẩn thanh cuộn nếu không cần thiết

Tôi đang cố gắng tìm ra làm thế nào tôi có thể che giấu overflow-y:scroll;nếu không cần thiết. Ý tôi là tôi đang xây dựng một trang web và tôi có một khu vực chính mà các bài đăng sẽ được hiển thị và tôi muốn ẩn thanh cuộn nếu nội dung không vượt quá chiều rộng hiện tại.

Ngoài ra, câu hỏi thứ hai của tôi. Tôi muốn làm cho nó để khi bài viết vượt quá chiều rộng hiện tại, chiều rộng sẽ tự động tăng lên và nội dung sẽ không đi ra khỏi hộp.

Có ai có manh mối làm thế nào để làm điều này?

Khu vực bài viết:

.content {
    height: 600px;
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    font-size: 15px;
    text-align: justify;
    line-height: 19px;
    overflow-y:scroll;
}

Trang web chính container:

.container {
    margin: 0 auto;
    width: 757px;
    margin-top: 30px;
    text-align: center;
}

Đặt thuộc overflow-ytính thành autohoặc xóa hoàn toàn thuộc tính nếu nó không được kế thừa.

Bạn có thể dùng overflow:auto;

Bạn cũng có thể điều khiển trục x hoặc y riêng lẻ với các thuộc tính overflow-xvà overflow-y.

Thí dụ:

.content {overflow:auto;}
.content {overflow-y:auto;}
.content {overflow-x:auto;}

Bạn có thể sử dụng cả .content và .container để tràn: auto. Có nghĩa là nếu văn bản của nó vượt quá tự động cuộn sẽ đến trục x và trục y. (không cần phải phân tách trục x và trục y thường cho tràn: tự động)

.content {tràn: auto;}

.selected-elementClass{
    overflow-y:auto;
}

.container {overflow: auto;} sẽ thực hiện thủ thuật. Nếu bạn muốn điều khiển hướng cụ thể, bạn nên đặt tự động cho trục cụ thể đó. AE

.container {overflow-y: auto;} .container {overflow-x: hidden;}

Đoạn mã trên sẽ ẩn bất kỳ tràn nào trong trục x và tạo thanh cuộn khi cần trên trục y. Nhưng bạn phải đảm bảo rằng nội dung của bạn có chiều cao mặc định nhỏ hơn chiều cao của thùng chứa; nếu không, thanh cuộn sẽ không bị ẩn.