Настройка рекламного блока для мобильных

  • 1 Ответов
  • 435 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

Приветствую участников форума.

Помогите, пожалуйста, со следующей задачей.

Есть адаптивный рекламный блок, ширина которого должна меняться в зависимости от разрешения экрана. Рекламный блок находится в теле статьи (между абзацев), обязательно по центру.

Сейчас это реализовано в див-блоке с классом reklama:
.reklama
{margin: 0 25% 0 25%;
width: 50%;
padding: 5px; }

Погуглил, чтобы понять, как изменить пропорции для разных разрешений экрана и нашел следующее. Чтобы пропорции остались такими же для разрешения экрана более 800px, пишу следующее:
@media screen and (min-width: 800px) {
reklama {margin: 0 25% 0 25%;
width: 50%;
padding: 5px; }
}

Вопрос №1: правильно ли это?
Вопрос №2: как мне сделать так, чтобы при разрешении экрана менее 800px пропорции менялись на  margin: 0 15% 0 15%; width: 70% (при этом класс остается тем же самым .reklama)?

Благодарю за ответы.

*

Оффлайн darkghost

% - единицы в принципе должны сработать ибо так и поступают, чтобы блоки были резиновыми.
Вот чтобы указать, что
Цитировать
... чтобы при разрешении экрана менее 800px пропорции менялись на  margin: 0 15% 0 15%; width: 70% ...
необходимо прописать:
Размер экрана меньше 800px ---- @media screen and (max-width: 800px) {
.reklama { margin: 0 15% 0 15%; width: 70% }
}
Подробнее ---->>>
Спойлер
[свернуть]