Почему не работает position: relative у элемента elvo__window?
<section class="elvo"> <div class="container"> <div class="elvo__section"> <div class="elvo__window"> <p class="elvo__title">Компания elvo</p> <p class="elvo__input">Лучшая компания</p> <p class="elvo__text"> Строительная компания ELVO является проектной организацией, которая отвечает за подготовку всего проекта, в соответствии с договором или контрактом. </p> </div> <img class="elvo__img" src="Images/elvo.jpg" alt="" /> </div> </div> </section> |
<section class="elvo"> <div class="container"> <div class="elvo__section"> <div class="elvo__window"> <p class="elvo__title">Компания elvo</p> <p class="elvo__input">Лучшая компания</p> <p class="elvo__text"> Строительная компания ELVO является проектной организацией, которая отвечает за подготовку всего проекта, в соответствии с договором или контрактом. </p> </div> <img class="elvo__img" src="Images/elvo.jpg" alt="" /> </div> </div> </section>
.elvo__section { display: flex; margin-top: 80px; height: 770px; } .elvo__img { width: 700px; height: 500px; position: absolute; } .elvo__window { display: flex; flex-flow: column wrap; height: 510px; width: 460px; /*margin-left: 30px;*/ background-color: #f1f1f1; position: relative; } |
.elvo__section { display: flex; margin-top: 80px; height: 770px; } .elvo__img { width: 700px; height: 500px; position: absolute; } .elvo__window { display: flex; flex-flow: column wrap; height: 510px; width: 460px; /*margin-left: 30px;*/ background-color: #f1f1f1; position: relative; }
Дополнительно:
работает
оно работает, но подозреваю, что position нужен не для elvo__window, а для elvo__section, ведь elvo__img находится в нём
ну или нужно перенести elvo__img внутрь elvo__window
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Чтобы понять, почему не работает свойство position: relative у элемента с классом elvo__window, необходимо проанализировать структуру CSS и HTML кода, а также возможные взаимодействия с другими элементами на странице.
1. Проверьте, что у элемента с классом elvo__window действительно присутствует свойство position: relative в CSS стилях. Убедитесь, что это свойство не переопределяется в других местах стилей, например, в более специфичных селекторах.
2. Проверьте, есть ли другие элементы на странице, которые могут влиять на позиционирование элемента elvo__window. Например, если у родительского элемента данного элемента установлено свойство position: static (по умолчанию), это может повлиять на позиционирование элемента с классом elvo__window.
3. Убедитесь, что соседние элементы не перекрывают элемент elvo__window или не мешают ему корректно отображаться на странице. Используйте инструменты разработчика браузера для анализа расположения элементов на странице.
4. Проверьте, что у элемента с классом elvo__window не установлено свойство z-index, которое может перекрывать другие элементы на странице.
Пример использования тега
для отображения CSS кода: <pre lang="css"> .elvo__window { position: relative; /* Дополнительные стили */ }
Следуя этим шагам, вы сможете выявить возможные причины, по которым свойство position: relative не работает у элемента с классом elvo__window и найти способы исправить эту проблему.