Как добавить минимальное поле для содержимого электронной почты Zurb Ink?

Вот плункер, который я только что создал: http://plnkr.co/edit/jKo6yavo9fFNHiMsEvAL?p=preview

Это простой однорядный макет. Что мне нужно, так это фиксированный минимальный запас с обеих сторон (слева и справа) от ряда. Допустим, 25 пикселей. Изменение размера окна всегда должно показывать по крайней мере 25 пикселей серого фона до и после ряда.

Я пытался изменить table.container стиль от:

table.container {
    width: 580px;
    margin: 0 auto;
    text-align: inherit;
}

в

table.container {
    width: 580px;
    margin: 0 25px 0 25px;
    text-align: inherit;
}

Но, похоже, это не работает для правильного поля (уходит со страницы). Любое предложение?

1 ответ

Решение

Я думаю, что самым простым решением было бы использовать левую и правую границы таблицы вместо поля.

Что-то вроде CSS ниже должно помочь.

table.container {
    width: 580px;
    border-left: solid 25px #f1f0ef !important;
    border-right: solid 25px #f1f0ef !important;
    text-align: inherit;
}

Поскольку не все почтовые клиенты поддерживают маржу, другим вариантом будет добавление отступов / бордюра к внешней таблице / таблицам.

Если у вас есть какие-либо вопросы, дайте мне знать.

Другие вопросы по тегам