function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion

Visualforce inserting blank space in place of <li> on apex:dataList

Hi all,

I have a page with some css. There is a <section> tag inside which I am displaying few items from a list using <apex:dataList>. My code works in such a way that when the page loads, one row and four columns of data are displayed on the page. There is a 'View More" link which user can click to load more data. Once I click on this link the result is loaded on some columns with simple blank spaces. There are no null values on the list so I am not sure where this blank is coming from. See below a sample screenshot of the issue.

User-added image

Below is my code snippet.
<section data-tab='t-recent'>
<apex:dataList value="{!displayContentMap}" var="res">                   
                            <img src="/{!displayContentMap[res].mainpagearticle.Id}"/>
                            <h3>{!displayContentMap[res].dataCategory} | 
                                <apex:outputText value="{!displayContentMap[res].mainPageArticle.Display_Date__c}" />
                            <p><a href='/apex/Community_DetailPage?Id={!displayContentMap[res].mainPageArticle.knowledgearticleId}'>{!displayContentMap[res].mainPageArticle.Title}</a></p>
                          <apex:outputPanel rendered="{!showViewMore}"> 
                            <div class='more'><apex:form ><apex:commandLink action="{!showView}" reRender="resultBlock" >View More</apex:commandLink></apex:form><div class='icn'></div></div>

Have you tested to see what happens if on the very first page load you have the displayContentMap loaded with more than 4?  If it's the same problem then you can rule out the "show more" button.  It's probably a layout issue with divs and css.  You could comment out certain things to look for a culprit.