Новости Joomla

NorrCompetition 3.0 — новые возможности компонента конкурсов и голосований для Joomla 6

Релиз NorrCompetition 3.0 — крупное обновление расширения для проведения конкурсов и голосований в Joomla.

Вышли релизы безопасности Joomla 6.1.1 и Joomla 5.4.6

Релиз безопасности Joomla 6.1.1 и Joomla 5.4.6

Проект Joomla! рад сообщить о выходе Joomla 6.1.1 и Joomla 5.4.6. Это релизы безопасности и исправления ошибок для серий 5.x и 6.x.

👩‍💻 JoomShopping: Самый полный курс по созданию интернет-магазина на CMS Joomla.

👩‍💻 JoomShopping: Самый полный курс по созданию интернет-магазина на CMS Joomla.

В открытый доступ выложен видео-курс Дмитрия Гончарова по созданию интернет-магазина на связке Joomla + JoomShopping. Видеоуроки содержат пошаговые инструкции от регистрации хостинга до особенностей вёрстки, настройки способов оплаты и доставки.

В видео фигурирует JoomShopping 4 и Joomla 3, однако JoomShopping довольно консервативный компонент и многие способы и подходы в нём не менялись годами, поэтому данные видео могут быть по прежнему полезны.

Смотреть видео-курс

@joomlafeed

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

Phoenix168

  • Осваиваюсь на форуме
  • 36
  • 4 / 0
Резиновый дизайн. Двухколонный макет — не выходит.
« : 11.08.2008, 08:51:31 »
Есть задача сделать двухколоночный div-ный макет с фиксированной по ширине колонкой меню.
В качестве теоретического прототипа взял _ttp://htmlbook.ru/content/?id=102.

Код
<body>
<div id="top"><?php mosLoadModules ( 'user3', -2 ); ?></div>
<div id="wrapper">
<div id="main">
<div id="header">
	<div id="headerleft">
		<div id="headerright">
			<div id="headerback">
			<div id="logo"></div>
			<div id="buildings"></div>
			</div>
		</div>
	</div>
</div>
<div id="content">
<div id="user1"><?php mosLoadModules ( 'user1', -2 ); ?></div>
<?php mosMainBody(); ?>
</div>
<!-- end content -->
<div id="leftnav"><?php mosLoadModules ( 'left', -2 ); ?></div>
<div class="clear"></div>
<!-- end navigation -->
</div><!-- end main -->
</div><!-- end wrapper -->
<div id="footer"><?php include_once('includes/footer.php'); ?></div>
</body>
</html>

Вот эти <div id="content"> и <div id="leftnav">  ведут себя совсем не так как должны судя по статье, а именно несмотря на значительный margin-left у <div id="content">, <div id="leftnav"> все равно не встает слева от него, а находится слева но под <div id="content">.

В CSS нет почти ничего кроме
Код
#leftnav {
float: left;
width: 200px;
}
#content {
margin-left: 210px;
}
Записан
*

oleggrz

  • Захожу иногда
  • 435
  • 76 / 3
  • Только начал учиться.
Re: Резиновый дизайн. Двухколонный макет — не выходит.
« Ответ #1 : 11.08.2008, 10:29:02 »
Фрагменты из статьи на основе которой вы все это делали:
При формировании двухколонного макета левая или правая колонка устанавливается в заданное место через абсолютное позиционирование, а соседняя колонка освобождает для нее место за счет применения отступов. Для лучшего понимания рассмотрим пример, когда левая колонка имеет заданную ширину 200 пикселов, а ее положение определяется от левого верхнего угла окна браузера. Стиль для таких колонок приведен в примере 3.
...Значение absolute свойства position позволяет задавать положение слоя относительно края окна браузера независимо от наличия и местоположения других слоев. Сами координаты устанавливаются с помощью параметров left, top, right и bottom, которые соответственно определяют расстояние от левого, верхнего, правого и нижнего края окна. Чтобы левая и правая колонка не накладывались друг на друга, следует добавить отступ слева (margin-left) для слоя rightcol, как показано в данном примере. Значение этого отступа включает расстояние от левого края (параметр left) и ширину левой колонки (width) плюс дистанция между колонками.
Записан
*

Phoenix168

  • Осваиваюсь на форуме
  • 36
  • 4 / 0
Re: Резиновый дизайн. Двухколонный макет — не
« Ответ #2 : 11.08.2008, 11:28:18 »
Мне больше подходит вариант верстки без применения абсолютного позиционирования. В статье это то что идет после заголовка «Использование плавающих элементов» до заголовка «Применение позиционирования».  ^-^

Отдельно от шаблона J! — пример №1 из статьи работает.
P.S. появилась идея поменять дивы местами.. будем пробовать...

Update:
Вобщем все выходит просто внимательнее смотреть надо и знать мат.часть в области того как браузеры html-код верстки обрабатывают:
Достаточно поменять местами дивы <div id="content"> и <div id="leftnav"> — и все работает ::).
Всем спасибо за внимание.

« Последнее редактирование: 13.08.2008, 12:54:43 от Phoenix168 »
Записан
1   Вверх
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Как поправить макет блога?

Автор wishlight

 Ответов: 4
Просмотров: 1255 		Последний ответ 26.04.2019, 10:35:57
от wishlight
Элемент flexbox выходит за края родителя [РЕШЕНО]

Автор dm-krv

 Ответов: 3
Просмотров: 10952 		Последний ответ 05.04.2019, 16:07:44
от dm-krv
Резиновый слайдер в jm-services

Автор k790

 Ответов: 0
Просмотров: 1079 		Последний ответ 07.12.2017, 16:40:28
от k790
css: Резиновый модуль поиска

Автор slepoy

 Ответов: 1
Просмотров: 2154 		Последний ответ 08.02.2017, 21:23:22
от beliyadm
Список выходит за пределы экрана

Автор -sdr-

 Ответов: 0
Просмотров: 1684 		Последний ответ 18.01.2016, 08:17:07
от -sdr-