Отступы при обтекании рисунков

Месяц, пока настраивал сайт и готовил первые статьи не мог решить проблему с отступами рисунков. Поставил плагин NextGEN Gallery, разобрал весь его файл со стилями. Вроде все делал правильно, но текст при обтекании прилипал к рисункам и все, хоть плачь. Сделал белую рамку (border) вокруг рисунков размером 5 пикселей – как-то плохонько помогало.

Обнаружил решение: приоритеты при применении стилей непонятно для меня обрабатываются! Вот секция в основном файле стилей темы style.css:

/* =Images
————————————————————– */
#content img {
/*margin: 0; – вот эту строчку убрал в комментарии! */
height: auto;
max-width: 640px;
width: auto;
}
#content .alignleft,
#content img.alignleft {
display: inline;
float: left;
margin-right: 24px;
margin-top: 4px;
}

Я думал, что определение класса для выравнивания влево (#content img.alignleft) переопределит отступы для рисунка, а оказывается отступы брались из первого блока (#content img) и оставались равными нулю. Наверное, если бы вначале стоял  margin-right: 0, а потом был бы  margin-right: 24px, то замена  свойства произошла бы, но это уже пусть другие проверяют. Я для себя проблему решил.

Запись опубликована в рубрике Вебмастер. Добавьте в закладки постоянную ссылку.

1 комментарий: Отступы при обтекании рисунков

  1. Faith говорит:

    Thanks for your thoughts. It’s hepled me a lot.

Оставить комментарий