problems with outlining add-to-cart button

Hi,

I checked both pages on your website and I can see that since you took the screenshots, you switched to a 3 columns layout in order to give more space for each product of the listing, which seems to prevent the issue with the add to cart button.

Another solution could be to add a bit of custom CSS to your Joomla template in order to allow for more width usage on desktop and laptop screens. Here is a starting point:
forum.joomla.org/viewtopic.php?t=1000149

Another solution is to add CSS with white-space for the add to cart buttons to forbid the potential line return between the words:
developer.mozilla.org/en-US/docs/Web/CSS...operties/white-space
This is potentially the best.

Hi,

What do you mean by none of them worked ?
They have to work. If they don't, it means that you're not using the correct CSS code.

I had a deeper look at your website. For example, to make the main area + sidebar take the full width available, you can add such CSS code in media/templates/site/cassiopeia/css/user.css:

/* Expand the main content area to the left edge */
.site-grid .grid-child.container-component {
    grid-column-start: full-start !important;
}

/* Expand the sidebar area to the right edge */
.site-grid .grid-child.container-sidebar-right {
    grid-column-end: full-end !important;
}

.hikacart {
    white-space: nowrap !important;
}