Сообщений в теме: 4

[B_A_H_O]

Всем привет.

Хочу показать одно слабое место и подать идею для разработки в следующих версиях.

Сейчас на узких экранах, на пример с планшетов, получается нехорошая картина.

 

Нужно, чтобы в зависимости от ширины экрана менялось число колонок в категории (к примеру у меня с 4 на 3 колонки), или сайт уменьшался весь. А то получается совсем не красиво.

 

P.S. Я уменьшил экран до 1024х768 и получил такую картинку.

[Sliapy]

Задайте в CSS размер изображений в %.

[B_A_H_O]

так в системе же задаются размеры картинок, при чем в пикселях.

А автоматический переход на 3 колонки никак?

[CB9TOIIIA]

так в системе же задаются размеры картинок, при чем в пикселях.

А автоматический переход на 3 колонки никак?

 

Используйте CSS  @media

 /* Extra small devices (phones, up to 480px) */

 /* Small devices (tablets, 768px and up) */

 /* Medium devices (desktops, 992px and up) */ 

 /* Large devices (large desktops, 1200px and up) */

 
/* responsive - mobile versions */
 
@media screen and (max-width: 650px) {   }
 
/* Правила для дисплеев.*/
@media (max-width: 1200px){   }
 
/* Правила для узких дисплеев.*/
@media (min-width: 768px) and (max-width: 1199px){ }
 
 
/* Для телефонов */
 
/* Горизонт */
@media (max-width: 480px){  }
 
/* Портретка */
@media (max-width: 380px){  }
 
/* Tablets */
@media (min-width: 768px) and (max-width: 959px){  }
 
@media (max-width: 768px){  }
 
@media (min-width: 1px) and (max-width: 980px){ }

[Cheren-dow]

Может быть вам подойдет "мой" маленький фреймворк))

Задайте в CSS размер изображений в %.

#картинка{
   width: 100%;
   height: auto;
}