Rows and columns as ul and li

Hi!

I have changed the row tag to ul, and the column tag to li, to meet WooCommerce product loop standards while building a shop layout.

The problem is this:

<ul class="x-row">
   <div class="x-row-inner">
       <li class="x-col">
       </li>
   </div>
</ul>

As you can see, the markup is not valid because the li tag is wrapped inside a div with class of x-row-inner.

I have turned the global container off, but that doesn’t help either.

What would be the solution for this? Is there a way to change the x-row-inner div into ul instead of the x-row?

Thanks!

Hi @Misho,

Thanks for reaching out.
The Row Inner div will come automatically in the structure and there is no way to remove that. Alternatively, I would suggest you use the <ul> for the Column and add a DIV element for the <li> which will create the exact structure you want.

Screenshot 2022-01-18 205130

Hope it helps.
Thanks

1 Like

Thank you I will do that. Shame that I’ll lose the convenience of Row flexbox options.

Plus, Row has the ul tag option while it is incapable of delivering the full valid structure. I think that at least that one should be applied to the inner row.

Thanks.

Hi @Misho,

I will check with the ul option of Row and will create a feature request so it might be taken into account in the future.

Thanks

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.