Joomla Templates Club 406,261 posts

[paulhandyman Friend paulhandymanJoin date: October 2009Posts: 4Downloads:0Uploads:1 Thanks: 2]

#186176

I have problem with setting 2 columns article layout on JA ELASTICA frontpage (blog layout)… Going to: backend>Menus>Mainmenu>Home and setting layout to 2, 3 or 4 columns doesn’t have any impact on the front end. Eventually I solved this problem by deleting in temtemplates/ja_elastica/css/layout-wide.css

.cols-1 .item, .cols-2 .item, .cols-3 .item, .cols-4 .item, .cols-5 .item {
width: 100% !important;
}

and changing templates/ja_elastica/css/layout.css
.cols-2 .item {
width: 50%;
}

to

.cols-2 .item {
width: 50% !important;
float:left;
}

Now there are gaps between articles in main content area (see attached picture)

how to eliminate the gaps between the articles ??? I spent a couple of hours tweaking the CSS with Firebug but no luck so far….
Can anyone help please… Thank you in advance !!!

---

Attachments:

1. 

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#487988

Hi paulhandyman,

In general, the default layout of Article Featured – Joomla Content component is that It will sort your 2 columns into one row, which is counted from row-0 –> row-3 (4 rows with 8 articles on your homepage). The reason for the gaps is the different size of images in 2 articles of same row. You can see my snapshot for details.

I regret I couldn’t correct style for this issue. But you can see the codes which defined sorting 2 article in one row in
<blockquote>templatesja_elasticahtmlcom_contentfeatureddefault.php</blockquote>.

[PHP]

<?php
$key= ($key-$leadingcount)+1;
$rowcount=( ((int)$key-1) % (int) $this->columns) +1;
$row = $counter / $this->columns ;

if ($rowcount==1) : ?>

<div class=”items-row cols-<?php echo (int) $this->columns;?> <?php echo ‘row-‘.$row ; ?>”>
<?php endif; ?>
<div class=”item column-<?php echo $rowcount;?><?php echo $item->state == 0 ? ‘ system-unpublished”‘ : null; ?>”>
<?php
$this->item = &$item;
echo $this->loadTemplate(‘item’);
?>
</div>
<?php $counter++; ?>
<?php if (($rowcount == $this->columns) or ($counter ==$introcount)): ?>
<span class=”row-separator”></span>
</div>

<?php endif; ?>
[/PHP]

---

Attachments:

1. 

[Author]

Posts