Наш постійний читач, і користувач WordPress за сумісництвом, цікавиться - як розмістити блок по центру контейнера або сторінки? І тут мається на увазі довільний код, включаючи, але не обмежуючись текстовим контентом. Наприклад, це можуть бути соціальні віджети або рекламний банер, який слід було б помістити по центру заданої області.

Отже, якщо для тексту всередині контейнера досить вказати CSS-параметри:

text-align: center;

Те наприклад для картинки, можна використовувати CSS-клас:

class = "aligncenter"

який заведений в системі за замовчуванням.

Що стосується довільних блоків, то тут може бути кілька варіантів. Два з них є найбільш дієвими, коли справа заходить до редагування вихідного коду шаблонів.

<Center> // ваш_код_блока </ center>

за допомогою тега «center» можна вирівняти по центру практично будь-який елемент оформлення на сайті. До того ж, він буде виконуватися пріоритетно щодо присвоєних CSS- стилів.

Якщо ж блок укладений у теги «div» або йому подібні, то можна застосувати CSS-параметр зовнішнього відступу «margin» . Вкажіть його для поточного стилю або наявного CSS- класу:

margin: 0 auto;

При цих значеннях «margin» має нульові відступи зверху і знизу, і рівновіддалений з боків. Але рекомендуємо доповнити ще одним атрибутом:

clear: both;

А цей параметр знімає всі можливі обтікання з правого та лівого боків цільового блоку, роблячи відображення на сторінці більш акуратним щодо інших об'єктів.

Таким чином, можна помістити будь-який блок по центру сторінки. Якщо Ви не маєте досвіду редагування HTML коду, то по можливості перевіряйте код на валідність. А виникли питання по темі залишайте в формі коментарів нижче.

поділіться з друзями: