Hello everyone. I need your help in a html coding.

Question

<li class="has-children">
<a href="#">Destinations</a>
<ul class="dropdown">
<li><a href="#">Destination-01</a></li>
<li><a href="#">Destination-02</a></li>
<li><a href="#">Destination-03</a></li>
<li><a href="#">Destination-04</a></li>
<li><a href="#">Destination-05</a></li>
</ul>
</li>

This is the code where I am going to add Destination's name. But if I add more number of destinations to the above code, it will display as a single list at one side. And I want them to be shown as half on one column half in center and half in right. Like items should display column wise.

So what do I need to do in my coding?

Answer 1

From your description, I understood that you are looking for something like a table.

Check the HTML <table>. You can do that with it.

example:
<table>
<tr>
<td>a</td>
<td>b</td>
</tr>
<tr>
<td>c</td>
<td>d</td>
</tr>
<tr>
<td>e</td>
<td>f</td>
</tr>
</table>

Answer 2

So you want to get thw table value of that column u need jquert for that let say colum 2 has proudct name .pic . Size.colour when user move to that section he will see a pop up displaying all content of that colum and row without loading to another page

Answer 3

You could use a table with three columns, using the <table> tag.

Alternatively, you can use CSS to get a three column layout:

https://www.w3schools.com/css/css3_multiple_columns.asp

Answer 4

💜 Alex Tusinean 🍇 Can we use table in dropdown menu items?
I mean in table there are table head and table row. And the items are filled according to that heading. But in case of my code, I want that when someone moves the mouse cursor over Destinations button on navbar, it should show all the listed destinations there not one by one in a single column but as I have described above items should be divided into 2 or 3 columns.

Answer 5

Do you mean something like
https://code.sololearn.com/W2sMRUqbwj1m/?ref=app