Forum for discussing general topics related to Couch.
2 posts Page 1 of 1
I want to display on my blog posts 'list' page, three items per row, with thumbnails etc.

I was hoping to use the CSS nth-child syntax in order to remove the right hand margin from the last item on each row so there's no extra space on the right of the last item IYSWIM.

So I was playing with code of the form:

Code: Select all
<ul class='essay-thumbs'>
<cms:pages masterpage='blog.php' limit='12' paginate='1'>
   
   <li class='portfolio-thumb'>
      <a href="<cms:show k_page_link />"><img src="<cms:thumbnail featured_image width='426' height='238' />" alt="" width='213' height='119'>
      <h4 class='thumb-title'><cms:show k_page_title /></h4></a>
      <span class='thumb-date'><cms:show k_page_date /></span>
   </li>

    <cms:if k_paginated_bottom>
        <cms:if k_paginator_required >
            Page <cms:show k_current_page /> of <cms:show k_total_pages /><br>
        </cms:if>
        <cms:show k_total_records /> Essays Found.
        Displaying: <cms:show k_record_from />-<cms:show k_record_to />
        <br />
        <cms:if k_paginate_link_prev >
            <a href="<cms:show k_paginate_link_prev />">prev</a>
        </cms:if>
        <cms:if k_paginate_link_next >
            <a href="<cms:show k_paginate_link_next />">next</a>
        </cms:if>
    </cms:if>


</cms:pages>

</ul>


Which could then be styled accordingly - but of course the pagination stuff is now inside of the <ul> tags which isn't nice.

Is there no way to use UL and LI elements then to display the list? Or am I missing a trick?

TY!
Solved it by using CSS nth-of-type which I didn't know existed until just now:

Code: Select all
div.essay-thumbs div:nth-of-type(3n) 
{
   margin-right: 0 !important;
}
2 posts Page 1 of 1