2016-08-13 6 views
1

Я сделал свой сайт и теперь начал делать его отзывчивым, но у меня проблемы. При минимальной ширине экрана (ниже 670 пикселей) я помещаю свое меню под логотип. I centerd логотип, но я не могу центра меню под ним. Потерянный целый день с FireBug, но не могу найти ошибку, которую я сделал.Как центрировать меню css

Вы можете посмотреть веб-сайт по адресу http://www.kamari.info

Это меню по самым низким ширины экрана.

#banner1menu > div.inner { 
 
\t color: #ffffff; 
 
\t margin-top: 30px; 
 
\t text-align: right; 
 
\t font-size: 12px; 
 
\t font-family: 'open_sanssemibold'; 
 
} 
 
#banner1menu ul.menu, #banner1menu ul.maximenuck { 
 
      margin: 0; 
 
      padding: 0; 
 
} 
 

 
#banner1menu ul.menu li, #banner1menu ul.maximenuck li { 
 
\t margin: 0; 
 
\t padding: 0; 
 
\t display: inline-block; 
 
\t list-style:none; 
 
} 
 

 
#banner1menu ul.menu > li > a, #banner1menu ul.menu > li > span.separator, 
 
#banner1menu ul.maximenuck > li > a, #banner1menu ul.maximenuck > li > span.separator{ 
 
    display:block; 
 
\t border-right: #ffffff 2px solid; 
 
\t color: #ffffff; 
 
\t margin-bottom: 5px; 
 
\t padding-right: 12px; 
 
\t padding-left: 12px; 
 
\t font-size: 12px; 
 
\t font-family: 'open_sanssemibold'; 
 
} 
 

 
#banner1menu ul.menu > li:hover > a, #banner1menu ul.menu > li:hover > span.separator, 
 
#banner1menu ul.maximenuck > li:hover > a, #banner1menu ul.maximenuck > li:hover > span.separator { 
 
\t color: #555555; 
 
\t font-size: 12px; 
 
\t font-family: 'open_sanssemibold';

custom.css

#cont1 { height: 32px; } 
 

 
#head2logo > div.inner {margin-top: -6px;} 
 

 
#banner1menu ul.menu li.item-118 a { border-right: none; 
 
                padding-right: 0;} 
 

 
#banner1menu > div.inner {float: right;} 
 

 
#cont2 { height: 95px; } 
 

 
.flexslider { z-index: -1; } 
 

 
#cont2 { position: relative; 
 
       z-index: 9999; } 
 

 
/*#maincontent > div.inner { margin-top: -25px; }*/ 
 
#centar > div.inner { padding: 0 10px; } 
 

 
.djslider-default .slider-container {border-radius: 10px 10px 0 0; } 
 

 
.djslider-default .navigation-container .next-button { outline: none;} 
 
.djslider-default .navigation-container .prev-button { outline: none;} 
 

 
.sakrij { 
 
\t display: none !important; 
 
} 
 

 
@media screen and (max-width: 950px) { 
 

 
#cont1 { height: 53px; } 
 

 
#cont1 .flexiblemodule { 
 
\t width: 100% !important; 
 
float: none; 
 
} 
 

 
#head1kontakti > div.inner { margin-top: -15px;} 
 

 
.sakrij2 { 
 
\t display: none !important; 
 
} 
 
.prikaz2 { 
 
\t display: inline !important; 
 
} 
 

 
#cont2 { height: 140px; } 
 

 
#banner1 { 
 
\t height: auto !important; 
 
} 
 
#banner1 .logobloc { 
 
\t float :none !important; 
 
\t width: auto !important; 
 
} 
 
#banner1 img { 
 
\t display :block !important; 
 
\t margin: 10px auto 0 auto !important;} 
 

 
#banner1menu > div.inner {margin-top: 20px; 
 
\t \t \t \t \t float: left;} 
 
#banner1menu ul.menu li.item-101 a {             padding-left: 8px;} 
 

 
} 
 

 

 
@media screen and (max-width: 670px) { 
 

 
.sakrij3 { 
 
\t display: none !important; 
 
} 
 
.prikaz3 { 
 
\t display: inline !important; 
 
} 
 
#cont1 { height: 32px; } 
 
#head1kontakti > div.inner { margin-top: 0px;} 
 
#cont2 { height: 190px; } 
 

 
#banner1menu > div.inner {text-align: center;} 
 
#cont8 {display: none !important;} 
 

 
}

+0

Предоставлять весь код вашего меню инлайн пожалуйста –

+0

Выглядит, как вам нужно выравнивание текста: центр –

+0

да, где бы я положил его не реагирует. Я плохой в css –

ответ

0

ПРОБЛЕМА РЕШЕННАЯ - только что удалили навигационные знаки css суффикс из моего модуля joomla.

Извините за беспокойство и TNX очень много для ваших усилий

0

Это не просто, чтобы помочь без каких-либо фрагментов кода, но попробуйте это (заменителя, где это применимо в custom.css):

@media screen and (max-width:670px){ 
    #banner1menu ul.menu li.item-101 a{ 
     padding-left: 0 !important; 
    } 
    #banner1menu ul.menu{ 
     margin: 0 15px !important; 
    } 

} 
+0

извините, что не работает, что мне нужно :( –

+0

работает в моем браузере - сделал u заменил строки в вашем таможне.css –

+0

да, но нет проблем на экране @media и (max-width: 950px) он находится на максимальной ширине 670 пикселей. Меню под логотипом должно быть центрировано –

0

я я проверил, что я думаю, что это поможет вам много How to center align <li> items when it goes to 2nd line?

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

+0

это случай центрирования предметов li –

+0

hm, возможно, это может решить это, теперь я должен посмотреть, как это сделать :) –

+0

bootstrap помогает вам в создании сайта с учетом потребностей, пожалуйста, используйте w3schools для этого –

0
@media screen and (max-width:670px){ 
.meni { 
display: inline-block; 
margin: 0; 
padding: 0; 
width: 90%; 
} 
} 

Используйте это, чтобы сделать меню center.I подумайте, что это поможет вам

Смежные вопросы