Решено! "Изображение для вступительного текста материала" не форматируется

Discussion in 'Ошибки при работе с Joomla' started by Chek2000, Dec 8, 2015.

  1. Chek2000
    Offline

    Chek2000 Недавно здесь

    Joined:
    Dec 8, 2015
    Messages:
    4
    Likes Received:
    0
    Gender:
    Male
    При создании/редактировании материала во вкладке "Изображения и Ссылки" есть пункт "Изображение для вступительного текста материала", после добавления изображения оно появляется на главной странице, проблема заключается в том, что форматируется изображение под ширину колонки только в chrome, в остальных браузерах изображение появляется в полном размере и перекрывает другие колонки.
    Chrome: chrome.jpg
    Firefox: fox.jpg
    Что пробовал сделать:
    1. Менял версию php, на данный момент 5.6
    2. Менял Шаблоны
    3. Поставил joomla версию 3.5
    4. Испробывал около 5 браузеров (IE, Opera, Firefox...), корректное отображение только в UCbrowser на телефоне и Chrome
    Видимо проблема где-то в модуле отображения материала?
    Подскажите, в какую сторону рыть?
     
    Last edited: Dec 8, 2015
  2.  
  3. Best Answer:
    Post #2 by OlegM, Dec 9, 2015
  4. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Best Answer
    Какой ужас :)

    В сторону CSS - "адаптивные изображения", где

    Код (css):
    1. img {
    2.     max-width: 100%;    
    3.     height: auto;
    4. }
     
    Chek2000 likes this.
  5. Chek2000
    Offline

    Chek2000 Недавно здесь

    Joined:
    Dec 8, 2015
    Messages:
    4
    Likes Received:
    0
    Gender:
    Male
    Спасибо огромное, глянул исходники, оказалось за отображение картинки отвечает класс.
    Код (css):
    1. .pull-left.item-image

    было:
    Код (css):
    1. .pull-left.item-image {
    2.    margin: 0 20px 18px 0;
    3. }

    стало:
    Код (css):
    1. .pull-left.item-image {
    2.    max-width: 100%;
    3.    height: auto;
    4.    margin: 0 20px 18px 0;
    5. }


    Теперь с отображением все в порядке. margin, так понимаю трогать не стоит? Последний вопрос: в стилях остался класс
    Код (css):
    1. .pull-right.item-image
    стоит ли изменить его св-ва как и в первом примере, т.е ширину и высотоу добавить?
     
  6. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Да.

    Можно было просто добавить то, что я написал - применилось бы сразу ко всем картинкам.
     
    Chek2000 likes this.
  7. Chek2000
    Offline

    Chek2000 Недавно здесь

    Joined:
    Dec 8, 2015
    Messages:
    4
    Likes Received:
    0
    Gender:
    Male
    Спасибо, пытался вписать в уже имеющиеся стили для img как вы советовали, но изменений не наблюдал, кстати говоря, у меня в файле css почему-то img описан аж 3 раза:

    Код (css):
    1. img {
    2.    max-width: 100%;
    3.    width: auto \9;
    4.    height: auto;
    5.    vertical-align: middle;
    6.    border: 0;
    7.    -ms-interpolation-mode: bicubic;
    8. }
    9. --------------------
    10. tr,
    11. img {
    12.      page-break-inside: avoid;
    13.    }
    14. --------------------
    15. img {
    16.      max-width: 100% !important;
    17.    }


    Это вообще нормально?

    Вообщем-то тему можно закрывать, проблема решена, спасибо еще раз.
     
    Last edited: Dec 9, 2015
  8. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Значит что-то другое переопределяло
     
  9. Chek2000
    Offline

    Chek2000 Недавно здесь

    Joined:
    Dec 8, 2015
    Messages:
    4
    Likes Received:
    0
    Gender:
    Male
    Я немного уменьшил код в css, вместо
    Код (css):
    1. img {
    2.    max-width: 100%;
    3.    width: auto \9;
    4.    height: auto;
    5.    vertical-align: middle;
    6.    border: 0;
    7.    -ms-interpolation-mode: bicubic;
    8. }
    9. --------------------
    10. tr,
    11. img {
    12.      page-break-inside: avoid;
    13.    }
    14. --------------------
    15. img {
    16.      max-width: 100% !important;
    17.    }


    сделал

    Код (css):
    1. img {
    2.    max-width: 100% !important;
    3.    width: auto \9;
    4.    height: auto;
    5.    vertical-align: middle;
    6.    border: 0;
    7.    -ms-interpolation-mode: bicubic;
    8. }
    9. --------------------
    10. tr,
    11. img {
    12.      page-break-inside: avoid;
    13.    }
    насколько я понимаю это ничего не изменит в отображении страницы? как закрыть тему?
     
  10. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Не должно
     
    Chek2000 likes this.

Share This Page

Loading...