Основа 5 - 1170 сетка рассчитана неправильно

0

Я начал изучать основы 5, и у меня есть приложение, которое использует сетку 1170, с колонками 70px и 30px желобами (70 * 12 + 30 * 11 = 1170). Altho, когда я ввожу значения по умолчанию для моего базового файла _settings.scss:

$ row-width: rem-calc (1170); $ column-gutter: rem-calc (30); $ total-columns: 12;

Но вместо столбцов ширины 70 пикселей ширина одного столбца составляет 97 пикселей. Кто-нибудь знает, как он рассчитывается, может быть, мне не хватает некоторых переменных настроек? Заранее спасибо.

Я выяснил, что в Chome, например, он генерирует столбец размером 68 пикселей с отступом 15px влево и вправо. Любой способ сделать левое и правое заполнение контейнера исчезнет?

  • 0
    Убедитесь, что вы не меняете переменные в «_settings.scss», а затем перекомментируйте их и ожидайте, что они вернутся к своим исходным значениям. Вам нужно будет сохранить и скомпилировать sass хотя бы один раз с их исходными значениями, чтобы вернуть их обратно.
Теги:
sass
zurb-foundation

2 ответа

1
Лучший ответ

Я вычислил свою проблему.

Оказывается, что фундамент 1170 grid, фактически представляет собой сетку 1200px с полями 15px по обе стороны от каждого столбца. Это действительно хорошая идея, учитывая, что мы хотим сохранить внешние поля для более низких разрешений для каскада кадров.

Таким образом, решение должно иметь $ row-width, установленное до 1200.

0

Я не использовал фундамент, но если вы хотите, вы можете создать новый класс для заполнения 0, например:

  .nopadding {
    padding:0;
  }

Также я думаю, что установка $ collapse: true сделает трюк.

  • 0
    Свернуть true удаляет все отступы столбцов, это все о боковых отступах, которые я хотел бы изменить в общем.
  • 0
    Я добавил класс для моего личного проекта начальной загрузки. Я тоже не хотел левого и правого отступа.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню