Новости Joomla

Новогодние скидки от Nevigen.com

Новогодние скидки от Nevigen.com

Рады сообщить о специальном предложении от Nevigen, разработчика расширений для JoomShopping.

Astroid обновился до версии 3.3.7!

Astroid обновился до версии 3.3.7!

Astroid — это мощный фреймворк для дизайнеров и разработчиков, позволяющий создавать адаптивные, быстрые и надежные веб-сайты и шаблоны на базе Joomla.

Как тестировать Joomla PHP-разработчику? Компонент Patch tester.

👩‍💻 Как тестировать Joomla PHP-разработчику? Компонент Patch tester.Joomla - open source PHP-фреймворк с готовой админкой. Его основная разработка ведётся на GitHub. Для того, чтобы международному сообществу разработчиков было удобнее тестировать Pull Requests был создан компонент Patch Tester, который позволяет "накатить" на текущую установку Joomla именно те изменения, которые необходимо протестировать. На стороне инфраструктуры Joomla для каждого PR собираются готовые пакеты, в которых находится ядро + предложенные изменения. В каждом PR обычно находятся инструкции по тестированию: куда зайти, что нажать, ожидаемый результат. Тестировщики могут предположить дополнительные сценарии, исходя из своего опыта и найти баги, о которых сообщить разработчику. Или не найти, и тогда улучшение или исправление ошибки быстрее войдёт в ядро Joomla. Напомню, что для того, чтобы PR вошёл в ядро Joomla нужны минимум 2 положительных теста от 2 участников сообщества, кроме автора. Видео на YouTubeВидео на VK ВидеоВидео на RuTubeКомпонент на GitHub https://github.com/joomla-extensions/patchtester@joomlafeed#joomla #php #webdev #community

1   Вниз
0 Пользователей и 1 Гость просматривают эту тему.
  • 14 Ответов
  • 17317 Просмотров
*

wtf555

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Горизонтальное меню во всю ширину
« : 03.07.2012, 21:18:00 »
Вопрос: как сделать горизонтальное меню на всю ширину страницы? И как сделать, что бы пункты меню было на одинаковом расстоянии между собой, а так же со всех сторон. К примеру: оступ 1 пункта меню от левого края 10px, и отступ 6 пункта меню 10px от правого края.
Сайт http://avenuegame.net/
Записан
*

Efanych

  • Глобальный модератор
  • 4683
  • 644 / 0
  • Меняю свою жизнь на 360°!
Re: Горизонтальное меню во всю ширину
« Ответ #1 : 04.07.2012, 01:07:17 »
ul {display:table; width:100%}
li {display:table-cell}
или
ul {width:100%; text-align:justify;}
li {display:inline-block}
Записан
Создание сайтов, шаблонов, помощь в решении проблем.
*

wtf555

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #2 : 04.07.2012, 11:34:23 »
Не помогло, не первый вариант, не второй...
Записан
*

Efanych

  • Глобальный модератор
  • 4683
  • 644 / 0
  • Меняю свою жизнь на 360°!
Re: Горизонтальное меню во всю ширину
« Ответ #3 : 04.07.2012, 11:42:28 »
Это общая схема, а не готовый код.
Записан
Создание сайтов, шаблонов, помощь в решении проблем.
*

wtf555

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #4 : 04.07.2012, 12:58:36 »
Цитата: Efanych от 04.07.2012, 11:42:28
Это общая схема, а не готовый код.
Да, я попытался добавить это в код, но результаты не те, что нужны
Записан
*

dynamit

  • Завсегдатай
  • 1744
  • 265 / 0
  • Winter Is Coming
Re: Горизонтальное меню во всю ширину
« Ответ #5 : 04.07.2012, 16:05:05 »
как-то так?
Спойлер
[свернуть]

Спойлер
[свернуть]
Записан
ТАМ ГДЕ ТЫ НИЧЕГО НЕ МОЖЕШЬ, ТЫ НЕ ДОЛЖЕН НИЧЕГО ХОТЕТЬ
==========================================================
Сайты на Joomla!. Верстка. Консультации.  ||  Яндекс уже не ищет, он уже продает (с)  ||    Создание шаблона для Joomla 2.5
*

wtf555

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #6 : 04.07.2012, 16:18:46 »
Почти, нужно что бы не было красного, и промежутки между пунктами меню заполнялись цветом заливки самих пунктов меню #191919
Записан
*

dynamit

  • Завсегдатай
  • 1744
  • 265 / 0
  • Winter Is Coming
Re: Горизонтальное меню во всю ширину
« Ответ #7 : 04.07.2012, 16:32:43 »
красная полоса - templates/beez_20/css/personal.css,  строка 482, в ul.menu li уберите из background цвет #800000
в #header ul.menu замените #333333 на #191919
и установите себе FireBug
Записан
ТАМ ГДЕ ТЫ НИЧЕГО НЕ МОЖЕШЬ, ТЫ НЕ ДОЛЖЕН НИЧЕГО ХОТЕТЬ
==========================================================
Сайты на Joomla!. Верстка. Консультации.  ||  Яндекс уже не ищет, он уже продает (с)  ||    Создание шаблона для Joomla 2.5
*

wtf555

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #8 : 04.07.2012, 16:44:00 »
Спасибо за помощь!
FireBug есть)) Просто я еще не совсем в CSS разбираюсь, учусь пока)
Записан
*

den_caruk

  • Захожу иногда
  • 64
  • 2 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #9 : 01.05.2013, 22:22:06 »
Код
#nav ul.menu{
        display: table;
	font-family: Arial, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	margin: 10px 0;
	padding: 0 10px 0 10px;
	list-style-type: none;
	font-size: 13px;
	background: #eee;
	height: 50px;
}

		
#nav ul.menu :first-child {
	padding: 0; 
}
#nav ul.menu li  {
	margin: 0;		
	width: auto;
	display: table-cell; 
	text-align: center;	
	height: 50px; 
	padding-left: 2px; 
	vertical-align: bottom; 
}
#nav ul.menu li a {
       width: 1000px;
	height: 50px;
	display: table-cell;
	vertical-align: middle; 
	padding: 0 20px;
	line-height: 50px;
	color: #666;
	text-decoration: none;
			}


#nav ul.menu li a:hover, #nav ul.menu li.active {
	background-color: #f5f5f5;
	border-bottom: 2px solid #DDD;
	color: #999;
			}
Горизонтальное меню на всю ширину для Joomla
« Последнее редактирование: 02.05.2013, 21:50:33 от den_caruk »
Записан
*

73anticrisis

  • Осваиваюсь на форуме
  • 16
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #10 : 05.10.2014, 18:24:30 »
Мой вариант для Joomla:

Код
#nav {width:100%;}
#nav ul.menu {text-align:justify;overflow:hidden;height:20px;cursor:default;}
#nav ul.menu:after {content:"1";margin-left:100%;height:1px;overflow:hidden;display:inline-block;}
#nav ul.menu li {display:inline;}
#nav ul.menu li a {display:inline-block;color:#1f588e;font:normal 17px/21px Georgia;text-transform:uppercase;text-decoration:none;}
#nav ul.menu li a:hover,  #nav ul.menu li.active a {color:#000;text-decoration:underline;}

Отличие от предыдущего - меню начинается у края div и заканчивается у края. Значит реально во всю ширину выходит. Вдруг кому пригодится.
« Последнее редактирование: 05.10.2014, 18:29:36 от 73anticrisis »
Записан
*

system1024

  • Осваиваюсь на форуме
  • 33
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #11 : 27.06.2016, 13:30:32 »
Никак не могу добиться одинаковой ширины пунктов меню и чтобы само меню было по всей ширине родительского div-а, как тут (нижний вариант). Использую шаблон t3_bs_blank
Никак не реагирует на display:table и т.д.
Может кто-то уже делал на этом шаблоне?
« Последнее редактирование: 27.06.2016, 13:46:04 от system1024 »
Записан
*

system1024

  • Осваиваюсь на форуме
  • 33
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #12 : 28.06.2016, 13:34:27 »
Когда делаю отдельное меню со своей разметкой и стилями, то получается все как надо, то есть корневые пункты меню имеют одинаковую ширину и растягиваются на всю ширину родительского блока. Вот код
Код
.top-s ul, ol {
		margin-bottom:0;
}

.top-line ul{

 display: table;
 width: 100%;
 table-layout: fixed;

}

.top-line li{
 display: table-cell;
 text-align: center;
 padding: 2px 0;
 border-left: 1px solid #D5D5D5;
 border-right: 1px solid #D5D5D5;
 border-collapse:collapse;
 border-left: none;
 vertical-align: middle;

}

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

system1024

  • Осваиваюсь на форуме
  • 33
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #13 : 28.06.2016, 15:36:35 »
Сделал так

Код
@media (min-width: 768px) {
 .navbar-nav {
 display: table;
 width: 100%;
}
}

@media (min-width: 768px) {
.navbar-nav > li{
 display: table-cell;
 text-align: center;
 border-left: 1px solid #D5D5D5;
 border-collapse:collapse;
 border-left: none;
 vertical-align: middle;
 float:none;
}
}

Но при таком раскладе ширина пунктов меню разная, подгоняется под размер содержимого, то есть названия меню.
Записан
*

system1024

  • Осваиваюсь на форуме
  • 33
  • 0 / 0
Re: Горизонтальное меню во всю ширину
« Ответ #14 : 28.06.2016, 15:57:01 »
Вроде сделал. По крайней мере работает. Хотя вариант наверное кривой.

В шаблоне t3 пользовательские стили прописываются в файле custom.css - он имеет приоритет над другими стилями.
Сделал так:

Код
@media (min-width: 768px) { /*Это чтобы мобильная версия не поломалась*/
.navbar-nav {
 display: table;
 width: 100%;
 table-layout: fixed;	
}
}

@media (min-width: 768px) {
.navbar-nav > li{
 display: table-cell;
 text-align: center;
 border-left: 1px solid #D5D5D5;
 border-collapse:collapse;
 border-left: none;
 vertical-align: middle;
 float:none;
 width: 100%;
}
}
@media (min-width: 768px) {
.navbar-nav > li:first-child {
width: 51px; /*Это для пункта меню с домиком*/
}
« Последнее редактирование: 29.06.2016, 08:09:00 от system1024 »
Записан
1   Вверх
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Кликабельность псевдоэлемента в пункте меню

Автор vasilii.pupkov

 Ответов: 4
Просмотров: 3608 		Последний ответ 29.12.2021, 23:15:38
от v42bis
Выпадающее меню

Автор DrShepard

 Ответов: 10
Просмотров: 3037 		Последний ответ 20.10.2021, 12:36:16
от DrShepard
Как закруглить края выпадающего меню?

Автор coliandra

 Ответов: 1
Просмотров: 1510 		Последний ответ 11.12.2020, 21:15:57
от effrit
При прокрутке страницы виджет залезает на меню

Автор coliandra

 Ответов: 2
Просмотров: 1433 		Последний ответ 27.11.2020, 11:33:58
от coliandra
Как убрать маркер только из одного пункта меню.

Автор kuraev64

 Ответов: 2
Просмотров: 1679 		Последний ответ 20.07.2020, 11:18:44
от kuraev64