Мне нужно переместить цвет фона, серый, вниз, чтобы покрыть длину страницы независимо от размера окна

#php #html #css

#php #HTML #css

Вопрос:

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

Я повозился с позицией в css, и цвет фона растянулся до нижней части страницы, но затем мой заголовок исчез.

Мой CSS…

 #headerContainer {
    margin: -60px 0px 0px 0px;
    background-color:#333;
    height: 60px;
    width: 100%;
    position: fixed;
}
.editCommentBody {
    margin: 60px 0px 40px 0px;
    height: 100%;
    text-align: center;
    background-color: #ddd;
}
  

Класс editCommentBody — это все, от заголовка до кнопки редактирования.
Веб-сайт

Ответ №1:

вы не установили значение для фиксированной позиции в своем стиле headerContainer .
попробуйте указать для него значение left:value и top:value, а также, когда вы используете позиции, поля иногда не работают, если ваше поле даже работает, оно имеет значение top:-60px, из-за чего ваш заголовок не отображается на экране, попробуйте это :

     #headerContainer {
    margin:0px;
    background-color:#333;
    height: 60px;
    width: 100%;
    position: fixed;
    left:0px;
    top:0px;
}
  

Комментарии:

1. Это мне очень помогло: D Спасибо

Ответ №2:

Попробуйте вместо этого добавить желаемый цвет фона в основной текст, вот так:

body { color: #ddd; }

Комментарии:

1. Возможно, это должен быть полностью другой пост, но какой смысл использовать тег body вместо тега div с определенным классом? Я только что использовал теги div, у меня даже нет тега body, что я упускаю?

2. Ваш HTML-документ должен быть в этой базе формата ` <!DOCTYPE html> <html> <head> <meta charset=»UTF-8″> <title>Название документа</title> </head> <body> Содержание документа…… </body> </html>`

3. Поэтому я ожидаю, что у него будет тег body, даже если вы вводите HTML с помощью PHP.

Ответ №3:

Попробуйте использовать:

 box-sizing: border-box;
  

Комментарии:

1. Я попробовал это в теге editcommentbody, и это не сработало 🙁

2. @AdamJones Ну, после повторного прочтения вопроса. Если единственная проблема заключается в том, что фон не растягивается, почему бы не присвоить свойство background контейнеру для упаковки, например, самому телу, если на странице больше ничего нет.