Пытаюсь вывести картинки инфоблоков в три столбца. Для этого использую компонент новости.
PHP
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" ; integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI70 6tWS" crossorigin="anonymous">
<?if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();
/** @var array $arParams */
/** @var array $arResult */
/** [id5514155|@global] CMain $APPLICATION */
/** [id5514155|@global] CUser $USER */
/** [id5514155|@global] CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);
?>
<div class="news-list container-fluid">
<?if($arParams["DISPLAY_TOP_PAGER"]):?>
<?=$arResult["NAV_STRING"]?>
<?endif;?>
<?foreach($arResult["ITEMS"] as $arItem):?>
<?
$this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
$this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
?>
<DIV class="news-item col-lg-4 col-md-4 col-sm-3 col-xs-2 col-1" id="<?=$this->GetEditAreaId($arItem['ID']);?>">
<?if($arParams["DISPLAY_PICTURE"]!="N" && is_array($arItem["PREVIEW_PICTURE"])):?>
<?if(!$arParams["HIDE_LINK_WHEN_NO_DETAIL"] || ($arItem["DETAIL_TEXT"] && $arResult["USER_HAVE_ACCESS"])):?>
<a href="<?=$arItem["DETAIL_PAGE_URL"]?>"><img
class="preview_picture"
border="0"
src="<?=$arItem["PREVIEW_PICTURE"]["SRC"]?>"
width="<?=$arItem["PREVIEW_PICTURE"]["WIDTH"]?>"
height="<?=$arItem["PREVIEW_PICTURE"]["HEIGHT"]?>"
alt="<?=$arItem["PREVIEW_PICTURE"]["ALT"]?>"
title="<?=$arItem["PREVIEW_PICTURE"]["TITLE"]?>"
/></a>
<?else:?>
<img
class="preview_picture"
border="0"
src="<?=$arItem["PREVIEW_PICTURE"]["SRC"]?>"
width="<?=$arItem["PREVIEW_PICTURE"]["WIDTH"]?>"
height="<?=$arItem["PREVIEW_PICTURE"]["HEIGHT"]?>"
alt="<?=$arItem["PREVIEW_PICTURE"]["ALT"]?>"
title="<?=$arItem["PREVIEW_PICTURE"]["TITLE"]?>"
/>
<?endif;?>
<?endif?>
</DIV>
<?endforeach;?>
</div>
Убрал вывод лишних деталей и попытался интегрировать сетку bootstrap.
PHP
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="
<?if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();
/** @var array $arParams */
/** @var array $arResult */
/** [id5514155|@global] CMain $APPLICATION */
/** [id5514155|@global] CUser $USER */
/** [id5514155|@global] CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);
?>
<div class="news-list container-fluid">
<?if($arParams["DISPLAY_TOP_PAGER"]):?>
<?=$arResult["NAV_STRING"]?>
<?endif;?>
<?foreach($arResult["ITEMS"] as $arItem):?>
<?
$this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
$this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
?>
<DIV class="news-item col-lg-4 col-md-4 col-sm-3 col-xs-2 col-1" id="<?=$this->GetEditAreaId($arItem['ID']);?>">
<?if($arParams["DISPLAY_PICTURE"]!="N" && is_array($arItem["PREVIEW_PICTURE"])):?>
<?if(!$arParams["HIDE_LINK_WHEN_NO_DETAIL"] || ($arItem["DETAIL_TEXT"] && $arResult["USER_HAVE_ACCESS"])):?>
<a href="<?=$arItem["DETAIL_PAGE_URL"]?>"><img
class="preview_picture"
border="0"
src="<?=$arItem["PREVIEW_PICTURE"]["SRC"]?>"
width="<?=$arItem["PREVIEW_PICTURE"]["WIDTH"]?>"
height="<?=$arItem["PREVIEW_PICTURE"]["HEIGHT"]?>"
alt="<?=$arItem["PREVIEW_PICTURE"]["ALT"]?>"
title="<?=$arItem["PREVIEW_PICTURE"]["TITLE"]?>"
/></a>
<?else:?>
<img
class="preview_picture"
border="0"
src="<?=$arItem["PREVIEW_PICTURE"]["SRC"]?>"
width="<?=$arItem["PREVIEW_PICTURE"]["WIDTH"]?>"
height="<?=$arItem["PREVIEW_PICTURE"]["HEIGHT"]?>"
alt="<?=$arItem["PREVIEW_PICTURE"]["ALT"]?>"
title="<?=$arItem["PREVIEW_PICTURE"]["TITLE"]?>"
/>
<?endif;?>
<?endif?>
</DIV>
<?endforeach;?>
</div>
Убрал вывод лишних деталей и попытался интегрировать сетку bootstrap.