TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

King Composer как сделать секцию во всю ширину (full width)

1 048

Здравствуйте друзья сегодня я хочу поделиться своим решением создания блоков во всю ширину, так-как достаточно часто при использовании сторонних тем ( не всегда поддерживающих плагин King Komposer) при применении свойства компонента ROW — fulll width блок просто смещается влево и не принимает положение во всю ширину страницы.

Содержание:

  1. Добавление ID к секции
  2. Добавление стилей на странице созданная King Composer

Я не буду лить много воды, Чуть ниже вы увидите CSS стили которые необходимо применить для того чтобы ваш блок принял положение во всю ширину без ошибок в верстке и отображения на устройствах. Также стоит учесть что данные стили пригодятся начинающим веб мастерам в версте не только для плагина King Composer, а и в повседневной практики верстки.

#FULL_WIDTH { width: 99.225vw !Important; position: relative !Important; margin-left: -49.59vw !Important; left: 50%!Important; }

Добавление ID к секции

Как Вы уже поняли, необходимо указать свойство ID — “FULL_WIDTH” для секции которой необходимо присвоить отображение во всю ширину ( указано на скриншоте ниже):

King Composer как сделать секцию во всю ширину (full width)

Добавление стилей на странице созданная King Composer

Далее добавьте выше указанные стили CSS в код страницы King Composer ( как это сделать показано на ниже)

King Composer как сделать секцию во всю ширину (full width)

На этом всё после применения данных стилей Ваш блок станет во всю ширину и будет отображаться адекватно не только на компьютерах но и на мобильных устройствах.

Если вам понравилась данная новость буду вам признателен если вы поделитесь ссылкой на неё в социальных сетях и поставите соответствующее количество звездочек для рейтинга страницы в Google.

Источник записи: https://mediadoma.com

Этот веб-сайт использует файлы cookie для улучшения вашего опыта. Мы предполагаем, что вы согласны с этим, но вы можете отказаться, если хотите. Принимаю Подробнее