Big Cartel - Luna 2x2 Домашняя страница продукта

Question

Я пытался сделать так, чтобы на моей домашней странице была сетка изображений 2х2. Уже была ветка с похожим вопросом. Ответ должен был включать этот код:

#home_page .canvas {
max-width: 590px;
}

Я сделал это, и это толкает мой нижний колонтитул влево. Я вошел в CSS и попытался при каждом упоминании нижнего колонтитула включить text-align: center; Код, хотя безрезультатно. Я также попытался поиграть с 590px, но он переворачивает изображения и больше не центрирует их.

Любая помощь приветствуется.

Вот ссылка на мою страницу: http://johnathonpowers.bigcartel.com/

Answer 1

Пожалуйста, удалите

float:left;

собственность от

#site_footer footer {

}

Класс CSS и все должно работать нормально для вас.

По сути, ваш класс нижнего колонтитула #site_footer должен выглядеть следующим образом:

#site_footer footer {
    width: 100%;
    min-width: 900px;
    clear: both;
    margin: 0 auto;
    padding-bottom: 0px;
    text-align: center;
}

Ваш класс нижнего колонтитула #site_footer в настоящее время выглядит следующим образом:

#site_footer footer {
    width: 100%;
    min-width: 900px;
    clear: both;
    float: left;
    margin: 65px auto 0px;
    padding-bottom: 10px;
    text-align: center;
}

Что может быть причиной того, что оба width а также min-width свойства (что тоже с большими различиями в значениях). Оставьте одно значение свойства width (либо width или же min-width). Точно так же почему float после clear? Понять это clear используется для удаления любых предыдущих поплавков. Если вы хотите продолжать плавать, нет причин писать clear: both

Надеюсь это поможет!!

РЕДАКТИРОВАТЬ: Пожалуйста, смотрите скриншоты ниже!!!!

#site_footer footer

#site_footer footer 2

Если вы удалите float:left, ваш div нижнего колонтитула будет отцентрирован. Если вы не можете этого сделать, вы можете переписать свойство float: left в вашем CSS-файле следующим образом:

#site_footer footer {
float:none !important;
}