По умолчанию он настроен по Три изображения в ряд, а задача настроить на Четыре в ряд. Мучаюсь уже несколько дней, перепробовал разное, но если удается установить 4-ре плашки в ряд, то во втором ряду уже ломает строй.
Все чего удалось достичь… красиво становится в 3 ряда и куча свободного места… Шаблон упрямо считает только до 3-х. Где это ограничение?
Помогите перестроить шаб...
.content_list.tiled { margin: 0 auto; } .content_list.tiled .clear { clear:both; } .content_list.tiled .tile { width:25%; float:left; margin-bottom: 0px; padding-right: 2px; box-sizing: border-box; clear: none; } .content_list.tiled .tile:nth-child(3) { padding-right: 0; } .content_list.tiled .tile .photo { display: block; width:96%; height:300px; overflow:hidden; margin-bottom: 10px; position:relative; background-color: #bdc3c7; background-size: cover; background-repeat: no-repeat; background-position: center 0; } .content_list.tiled .tile .photo .note{ position: absolute; padding:3px 6px; background:rgba(0,0,0,0.75); color:#FFF; font-size:12px; left:0; bottom:0; z-index: 1; } .content_list.tiled .tile .photo a > img { display: none; } .content_list.tiled .tile .photo a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .content_list.tiled .tile .photo .note span { color:#f1c40f; } .content_list.tiled .tile .ft_caption, .content_list.tiled .tile .ft_caption h2 { font-size: 16px; margin: 0; width: 96%; } .content_list.tiled .tile .ft_caption .value { color: #2c3e50; font-weight: bold; } .content_list.tiled .tile .ft_caption a { color: inherit; text-decoration: none; } .content_list.tiled .tile .ft_caption a:hover { text-decoration: underline; } .content_list.tiled .tile .ft_caption a.parent_title{ font-size:14px; font-weight: normal; color:#7f8c8d; } .content_list.tiled .tile .field { margin-bottom: 10px; width: 90%;} .content_list.tiled .info_bar { font-size: 12px; color: #7f8c8d; opacity: 0; transition: all 0.5s ease; } .content_list.tiled .tile:hover .info_bar { opacity: 1; } .content_list.tiled .info_bar .bar_item { float:left; margin-right: 5px; height:18px; line-height: 18px; } .content_list.tiled .info_bar .bar_item:last-child { margin-right: 0; } .content_list.tiled .info_bar .bi_comments{ padding-left:25px; background: url("../images/icons/comment-small.png") no-repeat 5px center; } .content_list.tiled .info_bar .bi_not_approved{ color:#BF0000; } .content_list.tiled .tags_bar { margin:10px 0; overflow: hidden; font-size: 12px; padding-left:20px; background:url("../images/icons/tag.png") no-repeat left center; height:18px; line-height:18px; } .content_list.tiled .tags_bar a { color:#BDC3C7; } .content_list.tiled .tags_bar a:hover { color:#d35400; } .content_list.tiled .info_bar .bi_date_pub{ padding-left:25px; background: url("../images/icons/calendar-small.svg") no-repeat 5px center; }