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


Поставить Поиск И Корзину С Иконкой В Мобильной Версии К Левой Части


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

#1 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Апрель 2015 - 21:32

Добрый день!

Может быть создадите отдельные главные ветки для решения вопросов в адаптивных шаблонах?

Вот хотелось бы поставить поиск и Корзину с иконкой в мобильной версии к левой части:

Screen70.jpg

А то они сейчас из-за моих изменений стоят криво :(

#2 Danil

Danil

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

  • Модераторы
  • 4 645 сообщений

Отправлено 27 Апрель 2015 - 11:18

Просмотр сообщенияAndrew S. (25 Апрель 2015 - 21:32) писал:

Добрый день!

Может быть создадите отдельные главные ветки для решения вопросов в адаптивных шаблонах?

Вот хотелось бы поставить поиск и Корзину с иконкой в мобильной версии к левой части:

Прикрепленный файл Screen70.jpg

А то они сейчас из-за моих изменений стоят криво :(
Здравствуйте.
В конец main.css добавьте
@media screen and (max-width: 540px) {
.searchForm {
float:left;
}
.cartBtn {
  float: left;
}
}


#3 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 28 Апрель 2015 - 07:59

Просмотр сообщенияDanil (27 Апрель 2015 - 11:18) писал:

Здравствуйте.
В конец main.css добавьте
@media screen and (max-width: 540px) {
.searchForm {
float:left;
}
.cartBtn {
float: left;
}
}

Спасибо! Это уже лучше.

И ещё подскажите, можно ли таким же образом подровнять две позиции для адаптивного:

Screen74.jpg

1. Для наименования - чуть влево на определённое кол-во пикселей сдвинуть

2. Чуть вправо на опред кол-во пикселей.

А то в основном шаблоне была корректировка и она влияет на отображение в адаптивном.

3. И можно ли поиск только в адаптивном отобразить после логотипа внизу и перед выбором каталога. Если проблематично - то не обязательно.

#4 Danil

Danil

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

  • Модераторы
  • 4 645 сообщений

Отправлено 28 Апрель 2015 - 09:30

Просмотр сообщенияAndrew S. (28 Апрель 2015 - 07:59) писал:

Спасибо! Это уже лучше.

И ещё подскажите, можно ли таким же образом подровнять две позиции для адаптивного:

Прикрепленный файл Screen74.jpg

1. Для наименования - чуть влево на определённое кол-во пикселей сдвинуть

2. Чуть вправо на опред кол-во пикселей.

А то в основном шаблоне была корректировка и она влияет на отображение в адаптивном.

3. И можно ли поиск только в адаптивном отобразить после логотипа внизу и перед выбором каталога. Если проблематично - то не обязательно.
В main.css найдите
@media screen and (max-width: 540px) {
.searchForm {
float:left;
}
.cartBtn {
float: left;
}
}
и замените на
@media screen and (max-width: 540px) {
.searchForm {
float:left;
}
.cartBtn {
float: left;
}

.body-top-left {
  padding-left: 6px;
}
.right_links {
  margin-right: 13px;
}
}
изменяйте значения 13px и 6px

#5 007

007

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

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

Отправлено 20 Октябрь 2015 - 18:48

Помогите, пожалуйста, выровнять поиск и корзину по одной горизонтали. Они у меня криво стоят.

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

  • пример 6.png


#6 Danil

Danil

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

  • Модераторы
  • 4 645 сообщений

Отправлено 20 Октябрь 2015 - 18:56

Просмотр сообщения007 (20 Октябрь 2015 - 18:48) писал:

Помогите, пожалуйста, выровнять поиск и корзину по одной горизонтали. Они у меня криво стоят.
В main.css найдите код
.searchForm {
	display: block;
	height: 100%;
	position: relative;
	text-align: right;
	float: right;
	width: 250px;
}
и замените на

.searchForm {
	display: block;
	height: 100%;
	position: relative;
	text-align: right;
	float: right;
	margin-top: 5px;
	width: 250px;
}
изменяйте margin-top(для поиска)
Так же найдите
.cartBtn {
	margin-bottom: -15px;
	display: inline-block;
	width: auto;
	height: 30px;
	padding: 0 2%;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	-o-transition: all .2s;
	transition: all .2s;
	text-align: left;
	white-space: nowrap;
	letter-spacing: -1px;
	border: 1px solid rgba(0,0,0,.17);
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	-moz-box-shadow: 0 1px 0 rgba(0,0,0,.05);
	overflow: hidden;
	white-space: nowrap;
	padding-right: 6px;
}
изменяйте margin-bottom(для корзины)

#7 007

007

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

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

Отправлено 20 Октябрь 2015 - 19:12

Благодарю!




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

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