CODEWITHSUNDEEP
phpcssarrays
永恆火焰
永恆火焰

Reputation: 31

Different css styling for last element of a php array Pt.2

Ok here is my new issue, and a complete description of what I am trying to accomplish. I used the suggestions you gave me and it worked fine, but when I changed the ORDER by information to a different field and the if statement, it went crazy.

Here is what I need, I have two columns on a page, when the array is processed I need it to display results filling each column left to right top to bottom. There is a division line between each item

<div class="centerBoxContentsFeatured centeredContent back  vLine " style="width:50%;">

and one under each item 

<div class="product-col" >.

If the item is the 3rd, 5th, 7th and so on… it will be on the left and does not need the “vLine “ div before it and if it is the last item(s) it does not need the “product-col” div under it as the last 2 items do not have to have the bottom divider, but if it is only two items on the whole page the bottom divider can stay. What am I doing wrong?

<?php
$count_temp  = count ($productid);
for ($i = 0; $i < $count_temp; ++$i) {
    $artist = get_the_title();
    if (($productartist[$i] == $artist ) && $categoryID[$i] ==1 ) {
    ?>
//Content//
<?php if (!($i === 0) && !($i % 2)  &&
         ($productid[$i] == 1) &&
         ( $i === (count ($productid) - 1))) {
             echo'<div class="product-col-none" >';
      }
      else  { echo '<div class="product-col" >';} 
?>
//Content//
<? if !( $i === (count ($productid) - 1))
   { 
        echo '<div class="centerBoxContentsFeatured centeredContent back  vLine " '.
             'style="width:50%;">';
   }
   else { 
        echo '<div class="centerBoxContentsFeatured centeredContent back " '.
             'style="width:50%;">';}
?>

Upvotes: 1

Views: 268

Answers (1)

user2273202
user2273202

Reputation:

You should write here about your css file code, you are making things complicated and unclear with your html embedded php code.

If you just want a different style for your odd numbered (3,5,7..) items and a different style for your last item then I'll recommend to use css pseudo classes

You can use css pseudo class last-child for your last item.

li:last-child
{
  // Your specific style for last item goes here
}

You can also use css pseudo class nth-child(odd) for alternating odd numbered items

li:nth-child(odd)
{
  // Your specific style for odd items goes here
}

I hope this is what you are looking for, Why to give a server side load when you can set things done at client end.

Upvotes: 1

Related Questions