Форум русской поддержки Joomla!® CMS
09.12.2016, 11:51:33 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Резиновая позиция модуля

 (Прочитано 521 раз)
0 Пользователей и 1 Гость смотрят эту тему.
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« : 05.03.2015, 18:15:01 »

Подскажите добавил новую позицию в шаблоне protostar - Default, как её сделать резиновой?, а то при разных разрешениях экрана она в разных местах  Sad

Добавил так в \ index.php \
<div class="48562"><jdoc:include type="modules" name="12345"/></div>

и в CSS
 #main-wrapper {
  overflow: hidden;
}
.48562
 {
  display: block;
  top: 80px;
  position: absolute;
  left: 1155px;
  background: #fff;
  width: 1120px;
  padding: 0px;
   align:left;}
Записан
DiabloZet
Осваиваюсь на форуме
***

Репутация: +5/-1
Offline Offline

Пол: Мужской
Сообщений: 191


Честь превыше всего!


« Ответ #1 : 05.03.2015, 23:21:42 »

Изучите @media, или у вас статический шаблон?
Записан
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« Ответ #2 : 06.03.2015, 05:17:05 »

шаблон у меня  protostar - Default резиновый.
Записан
ShfVD
Живу я здесь
******

Репутация: +65/-0
Offline Offline

Пол: Мужской
Сообщений: 922



« Ответ #3 : 07.03.2015, 16:56:44 »

Хотелось бы понять логику стиля вывода позиции
Код
display: block;
Блочный элемент на всю ширину родительского блока (надо понимать экрана)
Код
top: 80px;
Сдвигаете его вниз
Код
  position: absolute;
?
Код
 left: 1155px;
Сдвинул вправо ( практически в конец экрана), при том ширину задали
Код
width: 1120px;
т.е. виден только на панорамном мониторе
?
О какой резине может идти речь?
Записан
midav
Живу я здесь
******

Репутация: +113/-1
Offline Offline

Пол: Мужской
Сообщений: 946



« Ответ #4 : 07.03.2015, 17:02:33 »

Хотелось бы понять логику стиля вывода позиции
Grin я тоже не понял логики

В какое место хоть добавили эту позицию ? И где она должна быть по задумке ? Azn
Записан
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« Ответ #5 : 07.03.2015, 17:22:55 »

Добавил новую позицию в неё поставил модуль форму входа.
.48562
 {
  display: block;
  top: 80px;
  position: absolute;
  left: 1155px;
  background: #fff;
  width: 1120px;
  padding: 0px;
   align:left;}  А этим просто задал координаты позиции с модулем, но так как мой шаблон резиновый и при изменении разрешения экрана моя позиция с модулем ползает по экрану...
Вот я и прошу совета как мне прикрутить позицию в определенное место, чтобы при изменении размера экрана она оставалось на том же месте.



Записан
DiabloZet
Осваиваюсь на форуме
***

Репутация: +5/-1
Offline Offline

Пол: Мужской
Сообщений: 191


Честь превыше всего!


« Ответ #6 : 07.03.2015, 17:30:41 »

Цитировать
Хотелось бы понять логику стиля вывода позиции
Что как змеи? не гнобите новичка! а то он в один прекрасный день, узнает ваш IP и сломает веник на компе!! сломает ваш сайт и спи.... себе!!
sword852d вроде вместо left используется margin-left: 10px; у меня лично на статическом держит все нормально...
А вообще я уже говорил, учи @media, резиновый не значит что все за тебя делает... резину нужно написать ручками
Записан
ShfVD
Живу я здесь
******

Репутация: +65/-0
Offline Offline

Пол: Мужской
Сообщений: 922



« Ответ #7 : 07.03.2015, 17:30:51 »

А что Вам мешает просто сделать нужный отступ сверху и просто прижать его вправо, навскидку
Код
display: inline-block;
float: right;
Записан
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« Ответ #8 : 07.03.2015, 17:55:31 »

Мне бы хотя бы один пример рылся в стандартном шаблоне чтобы выдернуть от туда пример как там в protostar это организовано, просто xz не могу понять как мои параметры координат позиции связать с этим @media

@media (max-width: 767px) {
   div.modal {
      position: fixed;
      top: 20px;
      left: 20px;
      right: 20px;
      width: auto;
      margin: 0;
   }
   
}  Пробовал примерно так позиция прикрепляется к экрану, но мои размеры перестают действовать(((((
Записан
DiabloZet
Осваиваюсь на форуме
***

Репутация: +5/-1
Offline Offline

Пол: Мужской
Сообщений: 191


Честь превыше всего!


« Ответ #9 : 07.03.2015, 18:03:22 »

Потому что нужно прописывать на все разрешения экранов...
Пропишите сразу 5-6 разрешений под разные экраны, и все будет нормально.
Кстати
Код:
@media screen and (min-width: 600px) and (max-width: 900px)
устанавливай минимальный размер и максимальный для указанного стиля
Записан
ShfVD
Живу я здесь
******

Репутация: +65/-0
Offline Offline

Пол: Мужской
Сообщений: 922



« Ответ #10 : 07.03.2015, 18:08:22 »

Что вы имеете ввиду под
Цитировать
а то при разных разрешениях экрана она в разных местах
разрешения под мобильные, или разные размеры экрана на десктопе?
Если сайт на локалке, то хотя бы покажите на скришотах что не так, но лучше ссылку.
Медиа запросы актуальны когда Вы делаете адаптивный шаблон, а это не совсем резиновый.
Адаптивный (используя медиазапросы) подстраивает под определенные разрешения (дискретно), а резиновый просто подстраивается под экран.
Записан
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« Ответ #11 : 07.03.2015, 18:17:23 »

Сайт на денвере. Пробую на 4-х разных мониторах 15, 17, 19, 22,5 дюймов и везде позиция в разных местах, так же если в Opera менять размер окна браузера моя самодельная позиция ездит по экрану. Под мобильные мне не обязательно. Просто хочу научится прикреплять позиции к резиновому шаблону protostar(((

Сейчас с планшета через часок выложу скрины!
« Последнее редактирование: 07.03.2015, 18:42:33 от sword852d » Записан
ShfVD
Живу я здесь
******

Репутация: +65/-0
Offline Offline

Пол: Мужской
Сообщений: 922



« Ответ #12 : 07.03.2015, 18:33:40 »

Скрины выложите
Записан
midav
Живу я здесь
******

Репутация: +113/-1
Offline Offline

Пол: Мужской
Сообщений: 946



« Ответ #13 : 07.03.2015, 18:55:15 »

Сайт на денвере. Пробую на 4-х разных мониторах 15, 17, 19, 22,5 дюймов и везде позиция в разных местах, так же если в Opera менять размер окна браузера моя самодельная позиция ездит по экрану. Под мобильные мне не обязательно. Просто хочу научится прикреплять позиции к резиновому шаблону protostar(((

Просто пропишите эту позицию в нужном месте шаблона . Где она должна быть ? В шапке или в блоке с контентом, или в боковой колонке ?
Зачем к этой позиции применять стили position:fixed или position:absolute ?
Конечно она будет плавать по экрану как хочет при изменении разрешения .
Что вот это за чудо стили ? :
Код:
  div.modal {
      position: fixed;
      top: 20px;
      left: 20px;
      right: 20px;
      width: auto;
      margin: 0;
   }

Или может мы просто не понимаем чего хотите добиться . Оъясните словами где этот модуль должен быть ? А ещё лучше нарисуйте картинку .
Записан
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« Ответ #14 : 07.03.2015, 19:07:36 »

Цитировать
Просто пропишите эту позицию в нужном месте шаблона .
Покажите пример как прописать позицию например в правом верхнем углу сайта?

Записан
ShfVD
Живу я здесь
******

Репутация: +65/-0
Offline Offline

Пол: Мужской
Сообщений: 922



« Ответ #15 : 07.03.2015, 19:14:37 »

Покажите пример как прописать позицию например в правом верхнем углу сайта?


Вопрос некорректен: а что должно быть слева?
Если пустое место это одно ( но тогда модуль не "плавал" бы) если какой-то блок, то опять же - равный по высоте (в одну строку с модулем, или обтекает).
Такое впечатление что информацию от вас нужно выдавливать. Слов/постов море - толку ноль.
Записан
DiabloZet
Осваиваюсь на форуме
***

Репутация: +5/-1
Offline Offline

Пол: Мужской
Сообщений: 191


Честь превыше всего!


« Ответ #16 : 07.03.2015, 19:17:20 »

Вот небольшой пример под мой экран...
Код:
<div style="margin-left: 398px; height: 100px; position: fixed; background: #000; width: 100px; color: #F00; font-family: fantasy; zoom: 2; text-align: center;">Тут позиция</div>
Записан
sword852d
Осваиваюсь на форуме
***

Репутация: +8/-0
Offline Offline

Сообщений: 166


« Ответ #17 : 07.03.2015, 19:26:56 »

Цитировать
<div style="margin-left: 398px; height: 100px; position: fixed; background: #000; width: 100px; color: #F00; font-family: fantasy; zoom: 2; text-align: center;">Тут позиция</div>

Спасибо огромное это, то что нужно!
Записан
DiabloZet
Осваиваюсь на форуме
***

Репутация: +5/-1
Offline Offline

Пол: Мужской
Сообщений: 191


Честь превыше всего!


« Ответ #18 : 07.03.2015, 19:31:07 »

 Grin
Записан
midav
Живу я здесь
******

Репутация: +113/-1
Offline Offline

Пол: Мужской
Сообщений: 946



« Ответ #19 : 07.03.2015, 19:37:44 »

 laugh
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet