После не долгого общения, ТС взялся за составление тестового СЯ для форума. Я рассказал в каком формате хотел бы видеть готовое СЯ и работа закипела. В данный момент жду выполнение заказа и приступаю к тестированию. О результатах обязательно отпишусь. Первое впечатление положительное. Надеюсь, что получиться у нас плодотворное сотрудничество.
Для форумов есть возможность составить СЯ ?
Если такой тарифный план еще действует, то заказал бы для теста. Если все будет отлично - продолжу сотрудничество в более крупных размерах.
Sitealert, Спасибо большое. Все работает, как надо ))) Пошел довольный тестировать 🍿
Ничего страшного ;) Большое спасибо за помощь в решении проблемы.
Очень надеюсь, что без скриптов получиться все реализовать :o
Не особо хотел палить пациента, ну если так проще, то проверяю на этом посте.
Сейчас включены настройки размеров в админке
Sitealert, есть такое. Поэтому я и выклыдаваю промежуточные этапу, чтобы потом можно было понять хронологию событий, с чего начинали и что получили. По большому счету, сейчас осталось прикрутить object-fit: cover; и понять, почему заголовок не переносится. Это увы выше моих способностей 🤣
Не, надо заполнить всю область, кок вот тут на примере с фоткой белок
Sitealert, да, но не так координально же ))) Тем более, что при таком "обрезании" не умещается полностью заголовок поста. Если обратите внимание, в предыдущих скринах он занимал 2 строчки, а в нынешнем одну.
Дублирую, то, что мне необходимо было:
Неа (((
Появляется непонятный отступ снизу и картинка все равно не помещается.
.crp_related { clear: both; margin: 10px 0; } .crp_related h3 { margin: 0 !important; } .crp_related ul { list-style: none; float: left; margin: 0 !important; padding: 0 !important; } .crp_related li, .crp_related a { float: left; overflow: hidden; position: relative; text-align: center; } .crp_related li { margin: 5px !important; border: 1px solid #ddd; padding: 6px; width: 180px; height: 125px; } .crp_related li:hover { background: #eee; border-color: #bbb; } .crp_related a { box-shadow: none !important; text-decoration: none !important; height: 100px; } .crp_related a:hover { text-decoration: none; } .crp_related .crp_title { color: #fff !important; position: absolute; bottom: 0; padding: 3px; color: #fff; font-size: .9em; text-shadow: 1000 .1em .1em .2em; background: rgb(0.5, 0.5, 0.5); background: rgba(0, 0, 0, 0.5); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .crp_related li:hover .crp_title { background: rgb(0.2, 0.2, 0.2); background: rgba(0, 0, 0, 0.8); } .crp_related li { vertical-align: bottom; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4); box-shadow: 0 1px 2px rgba(0,0,0,.4); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .crp_clear { clear: both; } .crp_title:visited { color: #fff !important; }
Как только не пытался впихнуть этот триклятый object-fit: cover; - не хочет работать :(
Sitealert, нет. То, что они в ряд - это отлично, так и надо. А вот отступов между ними нет и картинка прижата к верхнему краю. Сейчас пытаюсь своими силами подшаманить, пока не особо получается ...
Вот как это выглядит с теми стилями, что я выложил в первом посте. Там, где размозня - названия постов, которые берутся из заголовка записи
С твоими стилями вывод приобретает вот такой вид:
tommy-gung, не, немного не то ((( Получается 3 слипшихся квадрата в ряд ...
tommy-gung, в коде это выглядит примерно вот так, только в 1 строчку
<div class="crp_related "><h4>Похожие записи:</h4><ul><li><a href="http://www.site.ru/post-1/" rel="nofollow" target="_blank"><img src="http://www.site.ru/img/1.jpg" alt="Заголовок 1" title="Заголовок 1" style="max-width:180px;max-height:180px;" class="crp_thumb crp_correctfirst"><div class="crp_title">Заголовок 1</div></a></li><li><a href="http://www.site.ru/post-2/" rel="nofollow" target="_blank"><img src="http://www.site.ru/img/2.jpg" alt="Заголовок 2" title="Заголовок 2" style="max-width:180px;max-height:180px;" class="crp_thumb crp_correctfirst"><div class="crp_title">Заголовок 2</div></a></li><li><a href="http://www.site.ru/post-3/" rel="nofollow" target="_blank"><img src="http://www.site.ru/img/3.jpg" alt="Заголовок 3" title="Заголовок 3" style="max-width:180px;max-height:180px;" class="crp_thumb crp_correctfirst"><div class="crp_title">Заголовок 3</div></a></li></ul><div class="crp_clear"></div></div>
