Что мне нужно убрать из кода, чтобы у меня убрался скролл?
<section class="about" id="about"> <div class="about-img"> <img src="img/about.jpg" alt=""> </div> <div class="about-text"> <h2>Обо мне</h2> <h4>ТЕКСТ</h4> <p>МНОГО ТЕКСТА </p> </div> </section> |
<section class="about" id="about"> <div class="about-img"> <img src="img/about.jpg" alt=""> </div> <div class="about-text"> <h2>Обо мне</h2> <h4>ТЕКСТ</h4> <p>МНОГО ТЕКСТА </p> </div> </section>
.about { display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; gap: 1.5rem; } .about-img img { max-width: 530px; height: auto; width: 100%; border-radius: 8px; padding: 66px; } .about-text { padding: -13px; } .about-text h2 { font-size: 16px; line-height: 1; } .about-text h4 { font-size: 24px; font-weight: 600; color: #fe7c26; line-height: 1.7; margin: 15px 0 30px; } .about-text p { font-size: 14px; line-height: 1.8; margin-bottom: 4rem; } |
.about { display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; gap: 1.5rem; } .about-img img { max-width: 530px; height: auto; width: 100%; border-radius: 8px; padding: 66px; } .about-text { padding: -13px; } .about-text h2 { font-size: 16px; line-height: 1; } .about-text h4 { font-size: 24px; font-weight: 600; color: #fe7c26; line-height: 1.7; margin: 15px 0 30px; } .about-text p { font-size: 14px; line-height: 1.8; margin-bottom: 4rem; }
Cейчас у меня есть фото слева. И текст справа. Но почему-то создается нижний скролл :/ И расстояние между текстом и фотографией слишком большое. Я попробовала добавить падинг фото. Но тогда оно уменьшается в размере. А текст остается все так же далеко
Дополнительно:
где скролл ?
Ответы:
html, body { overflow: hidden; height: 100%; margin: 0; padding: 0; } |
html, body { overflow: hidden; height: 100%; margin: 0; padding: 0; }
- Вертикальный скролл в итоге сказал пока на пк и телефоне. Как же теперь сайтом пользоваться, интересно?
- Семён Окулов, каким сайтом?
- modelair, у человека ведь проблема с версткой, т.е. с сайтом. Если он вставит код meusov11 в свой проект, то на его сайте просто будет выключен скролл, и сайтом будет пользоваться невозможно.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Чтобы убрать скролл из кода, нужно проверить несколько возможных причин, почему появляется скролл:
1. Проверьте размеры контейнера, в котором отображается ваш контент. Если размер контейнера меньше размера содержимого, то появляется скролл. Попробуйте увеличить размер контейнера или уменьшить размер содержимого.
2. Проверьте стили CSS, которые могут влиять на размеры элементов и их расположение. Убедитесь, что у элементов нет заданного свойства overflow: auto или overflow: scroll, так как это может вызывать появление скролла.
3. Проверьте размеры изображений или других элементов внутри контейнера. Если они превышают размер контейнера, то это также может вызвать появление скролла.
Пример кода на PHP:
<div class="container"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum turpis ac nunc ultrices, ut dictum libero ultricies.</p> <img src="image.jpg" alt="Image"> </div>
Если после проверки всех этих пунктов скролл все еще присутствует, попробуйте посмотреть на другие стили или скрипты, которые могут влиять на отображение контента на странице. Возможно, какой-то скрипт добавляет дополнительное пространство, вызывая появление скролла.