Как сделать список категорий в 2, 3, 4 столбца? - Joomla 3.x: Шаблоны, разметка и макеты вывода

$class = ' class="first"';

$class = ' class="first cat-item"';

$columns=4;

$i=0;

foreach($this->items[$this->parent->id] as $id => $item)

if ($this->params->get('show_empty_categories_cat') || $item->numitems || count($item->getChildren())) :

$i++;

if (!isset($this->items[$this->parent->id][$id + 1]))
		{
			$class = ' class="last"';
		}

$class = ' class="last cat-item"';

<div <?php echo $class; ?> >

<div <?php echo $class . ' ' . style="width:'.number_format(100/$columns, 1).'%;"'; ?> >

<?php $class = ''; ?>

<?php $class = 'class="cat-item"'; ?>

endforeach;

endif;

<?php if(($i+1)%($columns)==0): ?>
	<div class="clr"></div>
<?php endif; ?>

.cat-item{
display: inline-block;
float: left;
box-sizing: border-box;
margin-left: 0;
margin-right: 0;
}
.clr{
display: table;
width: 100%;
clear: both;
}

padding-left: 15px;
padding-right: 15px;

$columns=4;

<div <?php echo $class . ' ' . style="width:'.number_format(100/$columns, 1).'%;"'; ?> >

<div <?php echo $class; ?> >

.cat-item{
width: 25%; //если в 3 колонки, то 33%
}

<?php if(($i+1)%($columns)==0): ?>
   <div class="clr"></div>
<?php endif; ?>

<?php if(($i)%($columns)==0): ?>
   <div class="clr"></div>
<?php endif; ?>

defined('_JEXEC') or die;

$app = JFactory::getApplication();

<?php if ($this->params->get('show_description_image') && $item->getParams()->get('image')) : ?>
				<img src="<?php echo $item->getParams()->get('image'); ?>" alt="<?php echo htmlspecialchars($item->getParams()->get('image_alt'), ENT_COMPAT, 'UTF-8'); ?>" />
			<?php endif; ?>

<?php if ($this->params->get('show_description_image')) : ?>
				<?php if($item->getParams()->get('image')): ?>
				<img src="<?php echo $item->getParams()->get('image'); ?>" alt="<?php echo htmlspecialchars($item->getParams()->get('image_alt'), ENT_COMPAT, 'UTF-8'); ?>" />
				<?php else: ?>
				<img src="<?php echo JURI::base(true). '/templates/' . $app->getTemplate(); ?>/images/<НАЗВАНИЕ КРТИНКИ.ЖэПэГэ>" alt="<?php echo htmlspecialchars($item->title, ENT_COMPAT, 'UTF-8'); ?>" />
				<?php endif; ?>
			<?php endif; ?>

<?php if ($this->params->get('show_description_image')) : ?>
<a href="<?php echo JRoute::_(ContentHelperRoute::getCategoryRoute($item->id, $item->language)); ?>">
<?php if($item->getParams()->get('image')): ?>
<img src="<?php echo $item->getParams()->get('image'); ?>" alt="<?php echo htmlspecialchars($item->getParams()->get('image_alt'), ENT_COMPAT, 'UTF-8'); ?>" />
<?php else: ?>
<img src="<?php echo JURI::base(true). '/templates/' . $app->getTemplate(); ?>/images/<НАЗВАНИЕ КРТИНКИ.ЖэПэГэ>" alt="<?php echo htmlspecialchars($item->title, ENT_COMPAT, 'UTF-8'); ?>" />
<?php endif; ?>
</a>
<?php endif; ?>

.page-header.item-title{
height: 45px;/*в два раза больше, чем одна строка*/
}