DLE - новости в две колонки полностью на css

DLE - новости в две колонки  полностью на css


Две части кода - одной мы обворачиваем наш shortstory блок с новостью, а второй мы добавляем в файл стилей. Скрин выше с уже существующего проекта. Позиционирование в две колонки. Далее инструкция:

1. Открыть шаблон короткой новости: templates/{THEME}/shortstory.tpl
2. Обвернуть ваш блок с выводом короткой новости тегом newwws

<div id="newwws">


пример ниже:

<div id="newwws">
<h3>[full-link]{title}[/full-link]</h3>
<div id ="cat"><strong>Раздел: </strong>{link-category} </div>
<div id="over">{short-story}</div>

<p>Просмотров: <b>{views}</b>&nbsp;&bull;&nbsp; {favorites} &nbsp;&nbsp; [full-link]<b>Скачать</b>[/full-link]</p>
</div>


3. Открыть файл стилей: templates/{THEME}/css/style.css.tpl
4. Добавить код:

#newwws{
display:inline-block;
width: 48%; /*Примерное число. На него влияют padding и margin*/
}

#over{
height:276px; /*Картинка 150рх + текст, после которой все будет обрезаться */
overflow: hidden; /*Не показывать текст, который не влез в 276px.*/
}


Если не задать обрезку текста, то придется для каждого поста подгонять его вручную. А самое забавное - на разных разрешениях экранов все это может покосить.

Логическим продолжением данной статьи является разработка шаблона на дополнительных полях собственно все тот же сайт-каталог, который на скриншоте выше, но переделан дизайн полностью!
Понравилась статья "DLE - новости в две колонки полностью на css" из раздела Создание сайта » Решения для DLE? Подпишись на RSS. Будь в курсе всего происходящего на сайте
Комментариев: 2 •  Просмотров: 12117   Дата: 18-июн-2013, 13:11

Похожие статьи

Комментарии


Гости
Отличное решение! Все работает! Спасибо!
(8 октября 2013 19:24) • цитировать • •

admin
Цитата: павел
Отличное решение! Все работает! Спасибо!


Спасибо, пользуйтесь на здоровье!
(8 октября 2013 19:36) • цитировать • •
b
i
u
s
|
left
center
right
|
emo
color
|
hide
quote
translit
© 2010-2015 artemmian.ru v 7.0: flexyflat tpl Designed by artstudios
Карта сайта HTMLКарта сайта XMLПравообладателям
Яндекс.Метрика