Changing a DataList from table style to the flow style left a number of <br> tags in between the <span> tags. By changing the options on the DataList configuration and amending the code behind.ascx.vb file a proper flowing <span> based list was created.
Originally the DataList was using the table style of presentation. I changed it to flow and found that there were <br> tags mixed in with the <span> tag. The <br> tag was after every fourth item.
<span id="dnn_ctr111_default_dltGallery"> <span><img id="dnn_ctr111_default_dltGallery_img0_0"src="..."></span> <span><img id="dnn_ctr111_default_dltGallery_img0_1"src="..."></span> <span><img id="dnn_ctr111_default_dltGallery_img0_2"src="..."></span> <span><img id="dnn_ctr111_default_dltGallery_img0_3"src="..."></span> <br> <span><img id="dnn_ctr111_default_dltGallery_img0_4"src="..."></span> <span><img id="dnn_ctr111_default_dltGallery_img0_5"src="..."></span> <span><img id="dnn_ctr111_default_dltGallery_img0_6"src="..."></span> <span><img id="dnn_ctr111_default_dltGallery_img0_7"src="..."></span> <br> </span>
Reading about the issue of the <br> tag on the Internet I saw suggestions which included:
- setting the RepeatColumns value sufficiently large to be never reached with the data shown, for example 999999999999999
- using a replace either in the VB code, or by JQuery to remove the <br>
- CSS to set the display value of the tag to none, noting that the desired content of the DataList may include legitimate instances of the tag.
I found that adjusting the RepeatColumns value had no effect, discovering that I was setting the value in the ode behind.
The code below illustrates my working DataList configuration in Flow layout with no defined columns and more importantly no <br> tags within the layout.
<asp:DataList id="dltGallery" runat="server" RepeatLayout="Flow" RepeatDirection="Horinzontal" > <ItemTemplate> ... </ItemTemplate> </asp:DataList>
Vertical Direction
I was curious to see the results if the direction was set to Vertical. In this case after each element span there is a <br> tag, giving a single column of entries. Changing the value of RepeatColumns alters the number of columns accordingly by moving the interval of the <br> tag.
