Cannot align horizonally inside calcite-panel

Question

I have two calcite-notice elements that I'd to display side by side (horizontally).

Both calcite-notices to be posted inside a calcite-panel.

The issue is that the notices are displayed vertically.

If I remove the calcite-panel tag, then the calcite-notices appear as intended, side by side.

The Calcite-panel doesn't allow horizontal elements?

https://codepen.io/lkoumis1/pen/KKGXNqv?editors=1000

@KittyHurley?

LefterisKoumis · Answer

Thank you. Yes, it does work if you place the notices inside another div , but it doesn't answer my question:

"The Calcite-panel doesn't allow horizontal elements?"

I used the panel in other scenarios, for example, where I placed a tab inside the panel. Several elements inside the tab were aligned horizontally with no issues. So, I guess the answer to my question is No unless if you use another component inside the panel and be the parent of the elements to be aligned horizontally.

FC_Basson · Answer

Try putting the panel content, i.e. the divs for each of the calcite-notice, within a single containing div, which acts as the panel default content container.