Power Platform Community Forum Thread Details

I have the following demonstration site but the menu is showed horizontally, how to show the options vertically?

Site de demonstração - Catia | Microsoft Copilot Studio

Categories:

Adjust CSS for vertical layout

.menu-class {
display: flex;
flex-direction: column; /* Sets the menu to stack vertically */
list-style-type: none;
padding: 0;
}

.menu-class li {
padding: 10px;
}

.menu-class li a {
text-decoration: none;
color: black;
}

Replace .menu-class with your actual menu class or ID.

Update HTML for Vertical Layout
<ul class="menu-class">
<li><a href="#">Option 1</a></li>
<li><a href="#">Option 2</a></li>
<li><a href="#">Option 3</a></li>
<li><a href="#">Option 4</a></li>
</ul>
Apply Flexbox Layout

.menu-container {
display: flex;
flex-direction: column;
}
Responsive Design
@media (max-width: 768px) {
.menu-class {
flex-direction: column;
}
}

Please click Does this answer your question if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it a Like.