Перейти к содержимому


Баннеры На Главной В Нижнем Меню


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 3

#1 miniplaneta

miniplaneta

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 140 сообщений

Отправлено 10 Август 2016 - 21:58

Добрый день.

Разместил баннеры на главной в области нижнего меню: рис.1. Как сделать чтобы эти баннеры в мобильной версии не сдвигались хаотично, а попадали в конец каталога нижнего меню, как на рис.2.
Возможно в HTML не в то место воткнул. Наверное надо куда-то после разделов (внутри)Блога разместить?

Прикрепленные изображения

  • 2.png
  • 3.png


#2 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 11 Август 2016 - 02:32

В main.css найдите:
/* мой блок под баннер В контакте на главной */
.MyBlock1 img {
width: 130px; height: 56px; border-radius: 10px; 
float: right; margin-top: -240px;
}
/* мой блок под баннер Пробное занятие на главной */
.MyBlock2 .MyButton1 {
border:none;background: #1c8eac; font-size: 14px;padding: 3px;border-radius: 8px;cursor: pointer;color:white; width:130px;height: 56px; text-align:center;
float: right; margin-top: -180px;
}

после него вставьте:
@media only screen and (max-width:700px){
.MyBlock1, .MyBlock2 {
	display: inline-block;
}
.MyBlock1 img, .MyBlock2 .MyButton1 {
	float: none;
	clear: both;
	display: inline-block;
	margin: 0;
}
}


#3 miniplaneta

miniplaneta

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 140 сообщений

Отправлено 11 Август 2016 - 16:56

Просмотр сообщенияVaccina (11 Август 2016 - 02:32) писал:

после него вставьте:
@media only screen and (max-width:700px){
.MyBlock1, .MyBlock2 {
display: inline-block;
}
.MyBlock1 img, .MyBlock2 .MyButton1 {
float: none;
clear: both;
display: inline-block;
margin: 0;
}
}

что-то выравнять по вертикали не удается (((, хотя размеры блоков вроде одинаковые задал

Прикрепленные изображения

  • 2.png


#4 MikDark

MikDark

    Активный участник

  • Модераторы
  • 6 468 сообщений

Отправлено 11 Август 2016 - 17:12

Просмотр сообщенияminiplaneta (11 Август 2016 - 16:56) писал:

что-то выравнять по вертикали не удается (((, хотя размеры блоков вроде одинаковые задал

В шаблоне main.css найдите код:
.MyBlock1, .MyBlock2 {
	display: inline-block;
}

и замените на:

.MyBlock1, .MyBlock2 {
	display: inline-block;
	float: left;
}





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных