Profile: michelL

Problem:
The customer wanted to make certain buttons on their website full-width to ensure a consistent and appealing layout across different parts of the site.
Solution:
We advised applying a CSS rule (width: 100%;) to make the buttons full-width. This rule was suggested to be added to the .tb-button__link selector to affect all buttons globally or to specific buttons using data attributes to restrict the changes to buttons shown in the provided screenshot:
Option 1:

.tb-button__link{
    width: 100%;
}

Option 2:

.tb-button[data-toolset-blocks-button="ff923b00a782de616999d8bee8398d8a"] .tb-button__link, .tb-button[data-toolset-blocks-button="c43a52d063fa7692dec80f6313473a50"] .tb-button__link{
    width: 100%;
}

Relevant Documentation:
https://toolset.com/course-lesson/adding-custom-css-to-templates-archives-and-views/

Problem:

I want to have full-width buttons in the WordPress archive loop, but the buttons' width is not extending on all devices.

Solution:

Add the following CSS code to your theme:

.post-type-archive-product .wp-block-toolset-views-view-template-block .tb-button .tb-button__link {
    width: 100%;
}