Перейти к содержимому

Сервис обмена электронных валют


ГуглХром некорректно отображает часть сайта

#1 Evgeniy3200

Evgeniy3200
  • Пользователь PRO
  • 1 149 сообщений
  • Репутация: 268
0

Отправлено 27 Май 2015 - 14:45

Добрый день! Проблема в следующем, в новых версиях гуглХрома немного некорректно отображается главаня страница (причем раньше такой проблемы не было), в остальных браузерах такой проблемы нету, даже эксплорер нормально отображает :)

 

В гуглхроме сейчас отображается так (выделил красным где должны блоки располагаться):

отображение в хроме.jpg

 

Должно выглядеть вот так (в остальных браузерах так отображается):

как должно быть.jpg

 

Как решить эту проблему отображения и вообще в чем причина сдвига блоков. Именно на главной сдвигаются, внутри категорий аналогичное отображение материалов, и там все нормально, блоки в два ряда отображаются в области контента.

Сайт everest-tour.by

 

Вот исходный код с главной страницы на всякий случай:

<div class="item-page">
		<h2>
			Актуальные предложения компании		</h2>
			<div><a href="/vizovaya-podderzhka/odnokratnaya-viza-v-litvu" class="b-offers__item" title="Визовая поддержка по открытие однократной шенген визы в Литву"> <img class="b-offers__image" alt="viza litva anons" src="/images/fotogalereya/razdely/vizy/viza_litva_anons.jpg" /> <span class="b-offers__heading"><span>Однократная виза в Литву</span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/vizovaya-podderzhka/odnokratnaya-viza-v-polshu" class="b-offers__item" title="Визовая поддержка по открытие однократной шенген визы в Польшу"> <img class="b-offers__image" alt="viza poland anons" src="/images/fotogalereya/razdely/vizy/viza_poland_anons.jpg" /> <span class="b-offers__heading"><span>Однократная виза в Польшу</span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/avtobusnye-ekskursionnye-tury/rossiya/piter-5dney" class="b-offers__item" title="тур в Питер на 5 дней с посещением Эрмитажа и Петергофа"> <img class="b-offers__image" alt="anons" src="/images/fotogalereya/avtobusnie/piter/anons.jpg" /> <span class="b-offers__heading"><span>Тур в Санкт-Петербург<br /> на 5 дней</span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/belarus/grafik-sbornykh-grupp" class="b-offers__item" title="График сборных экскурсий по Беларуси из Минска"> <img class="b-offers__image" alt="sborki-belarus" src="/images/fotogalereya/belarus/sbornie_grupi/sborki-belarus.jpg" /> <span class="b-offers__heading"><span>Экскурсии по Беларуси из Минска для сборных групп</span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/avtobusnye-ekskursionnye-tury/frantsiya/tur-vo-frantsiyu-amsterdam-parizh-praga" class="b-offers__item" title="Экскурсионный автобусный тур во Францию с экскурсиями в Амстердаме, ПАриже и Праге"> <img class="b-offers__image" alt="anons" src="/images/fotogalereya/avtobusnie/amsterd-paris/anons.jpg" /> <span class="b-offers__heading"><span>Автобусный тур во Францию <br />Амстердам-Париж-Прага </span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/avtobusnye-ekskursionnye-tury/chekhiya/tur-chehiya-budapesht-vena-praga" class="b-offers__item" title="Экскурсионный автобусный тур в Чехию с посещением Будапешта, Вены и Праги"> <img class="b-offers__image" alt="anons" src="/images/fotogalereya/avtobusnie/BudVenPraga/anons.jpg" /> <span class="b-offers__heading"><span>Автобусный тур в Чехию <br />Будапешт-Вена-Прага </span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/dopolnitelnye-uslugi/arenda-avtobusa" class="b-offers__item" title="Аренда туристического автобуса в Минске с водителем"> <img class="b-offers__image" alt="arenda avtobusov anons" src="/images/fotogalereya/razdely/druslugi/arenda_avtobusov_anons.jpg" /> <span class="b-offers__heading"><span>Аренда автобуса<br />туристического класса</span></span> </a></div>
<!-- /.b-offers__item -->
<div><a href="/kruizy/kruiz-tallin-stokgolm-helsinki" class="b-offers__item" title="Экскурсионный круиз на пароме Таллин-Хельсинки-Турку-Стокгольм-Рига-Вильнюс с экскурисонной программой"> <img class="b-offers__image" alt="anons-thtsr" src="/images/fotogalereya/avtobusnie/skandinavia/anons-thtsr.jpg" /> <span class="b-offers__heading"><span>Круиз в Скандинавию Хельсинки-Турку-Стокгольм </span></span> </a></div>
<!-- /.b-offers__item --> 

		</div>

</div>


						</div><!-- end main -->

Надеюсь на вашу помощь (особенно верстальщиков), вроде проблема не серьезная, ведь все работает, но как то не солидно отображается, и сердце гложит мое :(

 

Может в файле index.php надо что либо дописать, походу такая проблема с новыми версиями хрома только.


 

 

  • 0

Если вы можете наугад в полной темноте пробраться к собственной кровати, ни разу не ушибившись, значит, пора путешествовать!



robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85
Советую обратить внимание на следующее:
  1. Сайт отображается в разных браузерах по-разному
  2. Неправильное отображение таблицы на сайте
  3. Неправильное отображение сайта с телефонов
  4. Гугл некорректно отображает страницы сайта
  5. Некорректное отображение описание сайта в поиске

#2 ShowPrint

ShowPrint
  • Пользователь PRO
  • 1 729 сообщений
  • Репутация: 410

Отправлено 27 Май 2015 - 14:51

@Evgeniy3200, предполагаю что  это скорее всего связано со стилевыми параметрами... Вероятнее всего как-то по другому воспринимаются и/или обрабатываются margin и padding.

Чтоб проверить это предположение попробуй или чуть уменьшить размер картинок, или margin-ы (чтоб заведомо влезало содержимое по ширине). На основании этого эксперимента можно будет "рыть глубже" для понимания проблемы...


  • 1
MasterWEBS: третий дом - моё хобби и увлечение... Второй дом: работа - не меньше 12 часов в день...
Первый дом - под охраной: "Осторожно - злая жена!" (дрессировалась долго и надёжно) /*ссылку не просите - не дам!*/


#3 Evgeniy3200

Evgeniy3200
    Topic Starter
  • Пользователь PRO
  • 1 149 сообщений
  • Репутация: 268

Отправлено 27 Май 2015 - 17:08

@ShowPrint, вы как всегда....дали мне пинок в правильном направлении...это один из немногих случаев, когда я готов с удовольствием получать, чтобы смотерть в правильное направление :D  :lol: 

 

Получилось исправить, уменьшил стиль margin и все стало красиво.

 

В связи с этим следующий вопрос, можно ли подключить определенный стиль  в CSS, который будет работать и действовать только для определенного браузера?


  • 0

Если вы можете наугад в полной темноте пробраться к собственной кровати, ни разу не ушибившись, значит, пора путешествовать!



#4 ShowPrint

ShowPrint
  • Пользователь PRO
  • 1 729 сообщений
  • Репутация: 410

Отправлено 27 Май 2015 - 17:22

@Evgeniy3200, Рад что указал нужное направление...  :)

На движках не знаю, сам пишу ручками на php - в нем можно извратиться: прочитать/распарсить юзверь-агент и в зависимости от этого подключить нужный css...

В своем старом коде нашел:

<?php
echo "
<link rel='stylesheet' href='./".( strpos($_UserAgent,'msie')!=0 ? 'ie' : 'all' ).".css' type='text/css'>
";
if ( strpos($_UserAgent,'msie')!=0 || strpos($_UserAgent,'navigator')!=0 || strpos($_UserAgent,'firefox')!=0 )
{
echo "<link rel='stylesheet' href='./msie.css' type='text/css'>";
}
else
{
echo "<link rel='stylesheet' href='./chrome.css' type='text/css'>";
}
?>
Но я - самоучка, вполне возможно существует какой-нибудь более продвинутый способ...

  • 0
MasterWEBS: третий дом - моё хобби и увлечение... Второй дом: работа - не меньше 12 часов в день...
Первый дом - под охраной: "Осторожно - злая жена!" (дрессировалась долго и надёжно) /*ссылку не просите - не дам!*/


#5 Slava1988

Slava1988
  • Пользователь
  • 162 сообщений
  • Репутация: 13

Отправлено 28 Май 2015 - 10:40

попробуйте использовать свойство -webkit-padding-start


  • 0

#6 ShniderHost

ShniderHost
  • Пользователь
  • 204 сообщений
  • Репутация: 13

Отправлено 28 Май 2015 - 15:26

В связи с этим следующий вопрос, можно ли подключить определенный стиль  в CSS, который будет работать и действовать только для определенного браузера?
 можно через php, можно через JS, в гугл вбей "определить браузер пользователя", затем нужный скрипт запиливаем в if и инклюдим определенные стили.
  • 1


Оформление форума – IPBSkins.ru