CSS приховає смугу прокрутки, якщо вона не потрібна

435

Я намагаюся розібратися, як я можу приховати це, overflow-y:scroll;якщо не потрібно. Я маю на увазі те, що я будую веб-сайт і маю основну область, в якій публікуватимуться публікації, і я хочу приховати смугу прокрутки, якщо вміст не перевищує поточну ширину.

Також моє друге запитання. Я хочу зробити так, коли пости перевищують поточну ширину, ширина автоматично збільшуватиметься, а вміст не вийде з поля.

Хтось має підказку, як це зробити?

Площа повідомлень:

.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;
}

Основний контейнер веб-сайту:

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

html css

— Танос Паравантіс
джерело

Ви хочете приховати вертикальну або горизонтальну смугу прокрутки? Чи можете ви розмістити приклад з html-кодом, наприклад, на jsfiddle.net та зв’язати його тут

— RJo

Привіт, я розмістив 2 класи, якими користуюся. На html нічого, крім виклику класів.

— Танос Паравантіс

743

Встановіть overflow-yвластивість autoабо видаліть її, якщо вона не передається у спадок.

— RJo
джерело

Я міг би, але мені потрібна допомога з моїм другим питанням, також про ширину, збільшення авто.

— Thanos Paravantis

Ви завжди можете спробувати скористатися пошуком StackOverflow: stackoverflow.com/questions/450903 / ...

— RJo

Де прокрутка у ваших прикладах?

— Зелений

13

Встановлюючи overflow-y: autoвирішену мою проблему - посилання насправді не показує приклад цього ...

— Тінь

2

Слід зазначити, що overflow-x: autoтакож працює для приховування горизонтальних смуг прокрутки.

— Edward D'Souza

40

Можна використовувати overflow:auto;

Ви також можете керувати віссю x або y окремо за допомогою властивостей overflow-xта overflow-y.

Приклад:

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

— Айяппан К
джерело

20

Хоча ми дякуємо вам за вашу відповідь, було б краще, якби вона надала додаткову цінність поверх інших відповідей. У цьому випадку ваша відповідь не надає додаткового значення, оскільки інший користувач вже розмістив це рішення. Якщо попередня відповідь була вам корисною, вам слід проголосувати за неї, а не повторювати ту саму інформацію.

— Toby Speight

9

Ви можете використовувати як .content, так і .container для переповнення: auto. Значить, якщо це текст перевищено, автоматично прокрутка вийде осі x і y. (немає необхідності вводити роздільну вісь x і y-ось зазвичай дають переповнення: auto)

.content {overflow: auto;}

— Айяппан К
джерело

5

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

— Пратек Арора
джерело

1

.container {overflow: auto;} зробить трюк. Якщо ви хочете керувати певним напрямком, вам слід встановити авто для цієї конкретної осі. AE

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

Вищевказаний код приховає будь-яке переповнення по осі x та генерує смугу прокрутки, коли це потрібно на осі y. якщо ні, смуга прокрутки не буде прихована.

— Нееро
джерело