Между основным и нижним колонтитулом огромное пространствоCSS

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Anonymous
 Между основным и нижним колонтитулом огромное пространство

Сообщение Anonymous »

У меня проблема с моим CSS-кодом, по какой-то причине между основным и нижним колонтитулом есть пустое пространство. Я не знаю, откуда оно, должны быть разные изображения, поэтому я не могу использовать одно изображение для всех из них. Может быть, кто-нибудь знает, как решить эту проблему?
Я попробовал использовать столбцы flex и flex-direction, изменив поля, и ожидал, что это решит проблему. К сожалению, этого не произошло
body {
background-image: url(Изображение);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
margin: 0;
height: 100%;
display: flex;
flex-direction: column;
align-items: stretch;
}

/* Header */
.nav-pills {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-image: url(Изображение);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: fixed;
top: 0;
width: 100%;
border: 1px solid #e7e7e7;
z-index: 1000;
margin: 0;
}

.nav-item {
display: inline;
float: left;
border: 1px solid #404040;
}

.nav-link {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

.nav-link:hover {
background-image: url(Изображение);
background-position: center;
border-radius: 4px;
}

/* Footer */
.footer {
background-image: url(Изображение);
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
border: 1px solid #e7e7e7;
width: 100%;
padding: 10px 0;
position: fixed;
bottom: 0;
z-index: 1000;
text-align: center;
margin: 0;
margin-top: 0;
}

#span-text {
color: #000;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

.content-top, .content-bottom {
text-align: center;
}

.icon-link {
padding: 2px;
}

/* Стилі для 'post_details.html'. */
/* Стилі для заголовку блогу. */
.title {
border: 2px #eee solid;
color: black;
text-align: center;
padding: 10px;
font-family: 'Times New Roman', Times, serif;
}

/* Стилі для контенту блогу. */
#p-content {
text-align: center;
color: black;
font-family: 'Courier New', Courier, monospace;
}

/* Стилі для дати блогу. */
#p-created {
text-align: right;
color: black;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

/* Стилі для кнопки видалення блогу */
#delete-btn {
float: right;
margin: 1em;
}

/* Стилі для редагування блогу. */
#update-btn {
float: right;
margin: 1em;
}

/* Основний контейнер для контенту */
.main-content {
flex: 1;
padding-top: 60px; /* Висота заголовка */
padding-bottom: 60px; /* Висота футера */
margin-top: 60px; /* Висота заголовка */
margin-bottom: 60px; /* Висота футера */
}


Подробнее здесь: https://stackoverflow.com/questions/785 ... and-footer
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»