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


Сузить Меню


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

#1 ProninT

ProninT

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

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

Отправлено 21 Июль 2015 - 19:56

Здравствуйте! подскажите, как сузить меню как на скриншоте

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

  • Безымянный.jpg


#2 Vaccina

Vaccina

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

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

Отправлено 22 Июль 2015 - 04:28

1. В main.css найдите:
#custommenu ul.mainnav li.level0 {
border: medium none;
display: block;
float: left;
padding: 21px 5px 21px 0;
position: static;
text-align: left;
}
замените на:
#custommenu ul.mainnav li.level0 {
border: medium none;
display: block;
float: left;
padding: 11px 5px 11px 0;
position: static;
text-align: left;
}

далее найдите:
#menu .nav-right {
float: right;
margin-top: 14px;
text-align: right;
}
замените на:
#menu .nav-right {
float: right;
margin-top: 5px;
text-align: right;
}
далее найдите:
#menu {
margin: 0;
max-height: 80px;
position: relative;
}
замените на:
#menu {
margin: 0;
max-height: 60px;
position: relative;
}

2. В main.css найдите:
#breadcrumbs:before, #slideshow:before {
background-color: #3cabda;
background-image: url("http://design.babo4ek.net/sl-bg.jpg");
background-position: center top;
background-repeat: no-repeat;
bottom: 0;
content: "";
display: block;
left: 0;
position: absolute;
right: 0;
top: -80px;
z-index: -1;
}

в нем уменьшите значение стиля top до -60px

далее найдите:
#breadcrumbs {
  padding: 30px 0;
  position: relative;
}
замените на:
#breadcrumbs {
  padding: 0 0 10px;
  position: relative;
}


#3 orionych

orionych

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

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

Отправлено 16 Август 2015 - 09:08

Просмотр сообщенияVaccina (22 Июль 2015 - 04:28) писал:

1. В main.css найдите:
#custommenu ul.mainnav li.level0 {
border: medium none;
display: block;
float: left;
padding: 21px 5px 21px 0;
position: static;
text-align: left;
}
замените на:
#custommenu ul.mainnav li.level0 {
border: medium none;
display: block;
float: left;
padding: 11px 5px 11px 0;
position: static;
text-align: left;
}

далее найдите:
#menu .nav-right {
float: right;
margin-top: 14px;
text-align: right;
}
замените на:
#menu .nav-right {
float: right;
margin-top: 5px;
text-align: right;
}
далее найдите:
#menu {
margin: 0;
max-height: 80px;
position: relative;
}
замените на:
#menu {
margin: 0;
max-height: 60px;
position: relative;
}

2. В main.css найдите:
#breadcrumbs:before, #slideshow:before {
background-color: #3cabda;
background-image: url("http://design.babo4ek.net/sl-bg.jpg");
background-position: center top;
background-repeat: no-repeat;
bottom: 0;
content: "";
display: block;
left: 0;
position: absolute;
right: 0;
top: -80px;
z-index: -1;
}

в нем уменьшите значение стиля top до -60px

далее найдите:
#breadcrumbs {
padding: 30px 0;
position: relative;
}
замените на:
#breadcrumbs {
padding: 0 0 10px;
position: relative;
}

Воспользовалась этой инструкцией, всё получилось, только вот меню, которое над слайдером, теперь отчётливо выделено на своей полосе. Не знаю, как корректно объяснить, пробовала по одному из изменений в инструкции вернуть обратно, но это не убралось.
Подскажите, как убрать эту границу, но сохраняя сузившееся положение?

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

  • 2015-08-16_09-05.jpg
  • 2015-08-16_09-06.jpg


#4 Cupuyc

Cupuyc

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

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

Отправлено 16 Август 2015 - 09:25

Просмотр сообщенияblacksun92 (16 Август 2015 - 09:08) писал:

Воспользовалась этой инструкцией, всё получилось, только вот меню, которое над слайдером, теперь отчётливо выделено на своей полосе. Не знаю, как корректно объяснить, пробовала по одному из изменений в инструкции вернуть обратно, но это не убралось.
Подскажите, как убрать эту границу, но сохраняя сузившееся положение?

Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css найдите код:
#menu .inner:after {position: absolute;content: "";width: 100%;height: 1px;bottom: 0px;left: 0px;background: rgba(255, 255, 255, 0.1);}

Замените его на:
/* #menu .inner:after {position: absolute;content: "";width: 100%;height: 1px;bottom: 0px;left: 0px;background: rgba(255, 255, 255, 0.1);} */


#5 orionych

orionych

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

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

Отправлено 16 Август 2015 - 10:05

Просмотр сообщенияCupuyc (16 Август 2015 - 09:25) писал:

Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css найдите код:
#menu .inner:after {position: absolute;content: "";width: 100%;height: 1px;bottom: 0px;left: 0px;background: rgba(255, 255, 255, 0.1);}

Замените его на:
/* #menu .inner:after {position: absolute;content: "";width: 100%;height: 1px;bottom: 0px;left: 0px;background: rgba(255, 255, 255, 0.1);} */

Простите, сделала так, но оно осталось, наверное, я коряво описала эту штуку, вот на скринах постаралась выделить, чтоб было заметно.

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

  • 2015-08-16_10-01.jpg
  • Безымянный.png


#6 Vaccina

Vaccina

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

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

Отправлено 18 Август 2015 - 03:57

В main.css найдите:
#breadcrumbs:before, #slideshow:before {background-image: url("{ASSETS_IMAGES_PATH}sl-bg.jpg");background-color: #3cabda;background-position: top center;background-repeat: no-repeat;bottom: 0;content: "";display: block;left: 0;position: absolute;right: 0;top: -80px;z-index: -1;}
замените на:
#breadcrumbs:before, #slideshow:before {background-image: url("{ASSETS_IMAGES_PATH}sl-bg.jpg");background-color: #3cabda;background-position: top center;background-repeat: no-repeat;bottom: 0;content: "";display: block;left: 0;position: absolute;right: 0;top: -50px;z-index: -1;}


#7 orionych

orionych

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

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

Отправлено 18 Август 2015 - 17:33

Просмотр сообщенияVaccina (18 Август 2015 - 03:57) писал:

В main.css найдите:
#breadcrumbs:before, #slideshow:before {background-image: url("{ASSETS_IMAGES_PATH}sl-bg.jpg");background-color: #3cabda;background-position: top center;background-repeat: no-repeat;bottom: 0;content: "";display: block;left: 0;position: absolute;right: 0;top: -80px;z-index: -1;}
замените на:
#breadcrumbs:before, #slideshow:before {background-image: url("{ASSETS_IMAGES_PATH}sl-bg.jpg");background-color: #3cabda;background-position: top center;background-repeat: no-repeat;bottom: 0;content: "";display: block;left: 0;position: absolute;right: 0;top: -50px;z-index: -1;}


Да да! Спасибо огромное!! А то я уже было подумала, что меня просто глючит на ней)




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

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