Задать вопрос
Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Общие вопросы по вёрстке » Как сверстать шаблон вывода контента, 2 блока по бокам и один между ними?

Как сверстать шаблон вывода контента, 2 блока по бокам и один между ними?

     15.10.2016    Общие вопросы по вёрстке, Шаблоны (TPL)    2186

вопрос
Не могу понять, как такое можно осуществить... Увидел на сайте про авто, реализация очень интересная. Идет лента контента и в середине идет общий блок рубрики и там уже 5 блоков контента, 1 по центру (большой) и 2 по бокам. Так вот, как вывести через custom такое чудо? Вот тут реализовано - http://www.kolesa.ru/
Помогите пожалуйста с этим вопросом
Как сверстать шаблон вывода контента, 2 блока по бокам и один между ними?

Ответа пока нет

 

10 комментариев

irrwisch
Юзер

irrwisch - 16 октября 2016 13:41 -

Такое можно легко сделать с помощью flex
baseroad
Юзер

baseroad - 16 октября 2016 14:00 -

irrwisch, Помогите сверстать пожалуйста такой блок
redissx
Юзер

redissx - 16 октября 2016 20:31 -

2 шаблона, с помощью тега newscount в .tpl меняем вывод.
matthew_ellington
Юзер

matthew_ellington - 16 октября 2016 20:46 -

Существует такой замечательный псевдокласс :nth-child
baseroad
Юзер

baseroad - 17 октября 2016 15:28 -

redissx,помогите сверстать пожалуйста... Сам не справляюсь(((
Nigativ
Юзер

Nigativ - 17 октября 2016 16:10 -

Вот так можно!
HTML:

<div class="container">
<div class="left">Левый блок</div>
<div class="main">Центр</div>
<div class="right">Правый блок</div>
</div>


CSS:

.container {
  width:100%;
  display:flex;
}
.left{
  width:200px;
  float:left;
}
.right{
  width:400px;
  float:right;
}
.main{
  width:100%;
}

Ширину левого и правого блока ставьте свои.
irrwisch
Юзер

irrwisch - 17 октября 2016 17:25 -

И как Вы собираетесь в данной конструкции вывести 5 новостей из 1 tpl файла?
irrwisch
Юзер

irrwisch - 17 октября 2016 17:26 -

Раз сами не можете справиться, то вперёд в стол заказов, с оглашением бюджета.
baseroad
Юзер

baseroad - 17 октября 2016 18:32 -

Nigativ,
справа и слева выведутся 2 картинки по вертикали?
redissx
Юзер

redissx - 18 октября 2016 08:09 - 


                    <div class="wrapper">
                        {custom template="custom-mozaik" from="0" limit="5" cache="no"}
                    </div>



[newscount=1,3]
<div class="item-small"></div>
[/newscount]
[newscount=2]
<div class="item-big"></div>
[/newscount]
[newscount=4,5]
<div class="item-small moved"></div>
[/newscount]




.wrapper {display:flex; flex-flow:row wrap; justify-content:space-between;}
.item-small, .item-big {width:30%; background-color:#CCC;}
.item-small {height:200px;}
.item-big {height:420px;}
.moved {margin-top:-200px;}
Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

 01.10.2012 Prowockator  Общие вопросы по вёрстке
 11.02.2014 rambess1984  Общие вопросы по вёрстке
 14.08.2014 Julius123  Общие вопросы по вёрстке
 05.09.2014 onneuha  Общие вопросы по вёрстке, jQuery
 24.07.2015 Azbuka  Общие вопросы по вёрстке
 01.12.2015 fops88  Общие вопросы по вёрстке
 13.03.2016 baseroad  Общие вопросы по вёрстке, Хаки
 26.03.2016 Serge  Общие вопросы, Общие вопросы по вёрстке, Стили (CSS)
 26.03.2016 baseroad  Общие вопросы по вёрстке, jQuery
 27.09.2016 baseroad  Общие вопросы по вёрстке, Стили (CSS)
  • non-stop | Как решить проблему индексации DLE в пои ... 1
    Фото non-stop
    non-stop
    Как решить проблему индексации DLE в поиске Bing?
    19-12-2024, 17:02
    Забыл написать что обновился до последней версии 17.3
    Интересно узнать, это только у меня проблема, или это проблема движка? проверьте свои сайты на наличие в поиске Bing.
    В 11 винде именно эта поисковая система стоит по умолчанию . кроме того эта же поисковая система отвечает за индекс еще одного поисковика - yahoo. Эти системы могут давать дополнительный процент пискового трафика на сайты.
  • lutskboy | Как максимально грамотно организовать до ... 1
    Фото lutskboy
    lutskboy
    Как максимально грамотно организовать добавление материалов через SQL-запросы?
    18-12-2024, 21:39
    все верно. related_ids автоматом заполняется потом.
  • derebas | Убираем xfsearch из адресной строки 7
    Фото derebas
    derebas
    Убираем xfsearch из адресной строки
    16-12-2024, 02:35
    в правилах транслитерации для tagvalue поставьте замену " " => "-", например так
    str_replace(array('.', ' ', '/', '&', "'", '+', '«', '»', ':', '!'), array('', '-', '-', 'and', '', '', '', '', '', '')
  • toxicpioner | Убираем xfsearch из адресной строки 7
    Фото toxicpioner
    toxicpioner
    Убираем xfsearch из адресной строки
    15-12-2024, 19:31
    если в доп поле есть пробел, будет выдавать просто 403 стр
  • dj-avtosh | Воспользовался хаком удаление html из ад ... 2
    Фото dj-avtosh
    dj-avtosh
    Воспользовался хаком удаление html из адресной строки у новости, появилась ошибка, как пофиксить?
    12-12-2024, 17:26
    Нужно правило с year поднять выше всех в .htaccess
  • TeraMoune | Воспользовался хаком удаление html из ад ... 2
    Фото TeraMoune
    TeraMoune
    Воспользовался хаком удаление html из адресной строки у новости, появилась ошибка, как пофиксить?
    11-12-2024, 22:12
    У вас убрано слишком много отличительных признаков в ссылках и теперь ссылки пересекаются. Убрали xfsearch, убрали html, а так же зачем то убрали дефиз разделяющий id и alt_name. Теперь некоторые ссылки будут отвечать выражению под правила ссылок новостей. Исправить вы можете только переосмыслив эти ссылки и добавить в них каких-то отличительных особенностей, переосмыслить чпу.
  • toxicpioner | Как упорядочить ID новостей 19
    Фото toxicpioner
    toxicpioner
    Как упорядочить ID новостей
    9-12-2024, 22:24
    ***Комментарий удален***
  • DnCnv | Как показать только одну категорию, к ко ... 1
    Фото DnCnv
    DnCnv
    Как показать только одну категорию, к которой принадлежит новость?
    9-12-2024, 01:46
    ***Комментарий удален***
  • web102 | Почему не отображается картинка в галере ... 3
    Фото web102
    web102
    Почему не отображается картинка в галерее?
    4-12-2024, 11:49
    дайте адрес сайта. можно в личку
  • Shandi | Почему не отображается картинка в галере ... 3
    Фото Shandi
    Shandi
    Почему не отображается картинка в галерее?
    3-12-2024, 08:53
    Мне как ламеру ничего не понятно:( Кто-то это исправляет за денужку?
наверх