В чем дело?

  • Автор темы Whapspayods
  • Обновлено
  • 17, May 2024
  • #1
Эта страница не оптимизирована для мобильных устройств: контент шире экрана.
https://www.furniturefinder.biz/furniture/brand/

И эта страница удобна для мобильных устройств:
https://www.furniturefinder.biz/furniture/merchant/

У них одинаковый CSS и HTML-код. Вот код таблицы:
 <div id='atoz'>
<?php
 $columns = 3;

 $columnWidth = intval(100/$columns);

 $currentLetter = "";

 $currentColumn = 0;

 print "<table id='atozTable'>";

 print "<tr>";

 foreach($atoz["items"] as $item)
 {
 $firstLetter = strtoupper(substr($item["name"],0,1));

 if ($firstLetter <> $currentLetter)
 {
 if ($currentLetter)
 {
 print "</ul></td>";

 if ($currentColumn == $columns)
 {
 print "</tr>";

 print "<tr>";

 $currentColumn = 0;
 }
 }

 print "<td>";

 $currentColumn++;

 print "<h4>".$firstLetter."</h4><ul>";

 $currentLetter = $firstLetter;
 }
 if (strlen($item["name"])>150)
 {
 print "<li><a href='".$item["href"]."' title='".ucwords(strtolower($item["name"])")."'>".ucwords(strtolower(substr($item["name"],0,100)))."...</a></li>";
 } else {
 print "<li><a href='".$item["href"]."' title='".ucwords(strtolower($item["name"])")."'>".ucwords(strtolower($item["name"]))."</a></li>";
 }
 }

 print "</ul></td>";

 print "</tr>";

 print "</table>";

 print "</div>";
?>

</div>
Код (разметка): Что не так?

Whapspayods


Рег
17 Mar, 2013

Тем
63

Постов
184

Баллов
529
  • 19, May 2024
  • #2
Вместо публикации php-кода опубликуйте результаты html.

Нам проще разобрать.

Вы не хотите усложнять жизнь тем, кто хочет помочь. Это не табличные данные.

Это упорядоченный список плюс подсписки, и его следует кодировать соответствующим образом.

Используйте css, чтобы не отображать порядок по умолчанию.

Напишите css для каждого подсписка как встроенный блок, и он автоматически вызовет новые строки после достижения точки останова.

Таблицы должны сохранять свою внутреннюю целостность; если ряд слишком длинный, это сложно. Гэри
 

Евгений Буряк


Рег
28 Mar, 2013

Тем
63

Постов
205

Баллов
530
  • 07, Jun 2024
  • #3
Спасибо. Я вижу, в чем проблема. Мне нужно добавить в CSS: #table td{display:inline-block; выравнивание текста по левому краю; ширина: 45%} И у меня есть только 2 столбца для мобильного экрана или только 1 столбец с шириной: 100%.
 

Vano131984


Рег
14 Dec, 2010

Тем
70

Постов
163

Баллов
523
  • 11, Jun 2024
  • #4
Я не вижу того, что видишь ты. На моем мобильном телефоне все отображается нормально. Возможно, вам нужно очистить файлы cookie. Проблема, которую я увидел, заключается в следующем:
https://www.furniturefinder.biz/furniture/brand/

- эта ссылка покажет
https://www.furniturefinder.biz/furniture/brand

- это покажет «страница не найдена» только потому, что отсутствует последняя косая черта. Вероятно, вы хотите это исправить.
 

MarkuS2


Рег
09 Mar, 2013

Тем
73

Постов
204

Баллов
599
  • 15, Jun 2024
  • #5
Да, ссылка неверная: Правильно (со слэшем):
https://www.furniturefinder.biz/furniture/brand/

Эти изображения представляют собой скриншоты из инструментов разработчика Google для iPhone6/7/8 Plus. Также Google Mobile Friendly Test говорит: страница не оптимизирована для мобильных устройств.
https://search.google.com/test/mobi...x & utm_campaign=suit & id=MggdVBoaHv_LjCAgmnAmmg

и оптимизирован для мобильных устройствhttps://www.furniturefinder.biz/furniture/merchant/

)
https://search.google.com/test/mobi...x & utm_campaign=suit & id=7Sb2K5YvIvDu8RNJEQXH-A

Тот же CSS и HTML.
 

Roman481


Рег
01 Mar, 2016

Тем
74

Постов
205

Баллов
585
Тем
403,760
Комментарии
400,028
Опыт
2,418,908

Интересно