Extra Block Types (EBT) - New Layout Builder experience❗

Extra Block Types (EBT) - styled, customizable block types: Slideshows, Tabs, Cards, Accordions and many others. Built-in settings for background, DOM Box, javascript plugins. Experience the future of layout building today.

Demo EBT modules Download EBT modules

❗Extra Paragraph Types (EPT) - New Paragraphs experience

Extra Paragraph Types (EPT) - analogical paragraph based set of modules.

Demo EPT modules Download EPT modules

Scroll

Как расположить меню по центру (стандартная тема Bartik)

Как расположить меню по центру (стандартная тема Bartik)
, by

Как расположить меню по центру "Main menu" стандартной темы Bartik в Drupal 7?

1 answer
votes: 770
Answer

Вам нужно добавть css код:

#id_главного_меню{
  display: table;
  margin: 0 auto;
}

 

table, а не block потому что заранее нельзя сказать какая будет ширина у меню, а table в отличии от block не занимает 100% ширины, а только столько, сколько на самом деле занимает.


а в каком месте это надо делать, я в этих CSS ни чего не смыслю, какой файл открыть?

 

 

 

 

 


Установите firebug для firefox, он позволит вам посмотреть в каком файле писать css.

 


Спасибо, нашел.

 

Было так:

 

 

 

стало по центру, но меню приподнялось от желтой границы, а надо чтобы прилегала к желтой:

 

Подскажите что в этом случае можно поделать?


Вот весь текст относящийся к менюшке:

#main-menu {
clear: both;
display: table;
margin: 0 auto;
}
#main-menu-links {
font-size: 0.929em;
margin: 0;
padding: 0 15px;
}
#main-menu-links li {
float: left; /* LTR */
list-style: none;
padding: 0 1px;
margin: 0 1px;
}
#main-menu-links a {
color: #333;
background: #ccc;
background: rgba(255, 255, 255, 0.7);
float: left; /* LTR */
height: 2.4em;
line-height: 2.4em;
padding: 0 0.8em;
text-decoration: none;
text-shadow: 0 1px #eee;
-khtml-border-radius-topleft: 8px;
-khtml-border-radius-topright: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
-webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 8px;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
#main-menu-links a:hover,
#main-menu-links a:focus {
background: #f6f6f2;
background: rgba(255, 255, 255, 0.95);
}
#main-menu-links a:active {
background: #b3b3b3;
background: rgba(255, 255, 255, 1);
}
#main-menu-links li a.active {
border-bottom: none;
}
.featured #main-menu-links li a:active,
.featured #main-menu-links li a.active {
background: #f0f0f0;
background: rgba(240, 240, 240, 1.0);


Задайте высоту вашей менюшку
#main-menu {

   height: NNpx;

}


странно, ни чего не происходит, что 0px что 10px


Помогло следующее:

 

В #main-menu прописал:
height: 30px; 
text-align: center;

в #main-menu-links прописал:
display: inline-block ;

В данном случае  height повлияло на высоту