Line breaks in “Add to Cart” button

  • Resolved Oclair

    (@oclair)


    4 years, 8 months ago

    Hi there,

    I am trying to figure out how to prevent the line breaks in the “Add to Cart” text for the default button in the form.

    Generally I believe the font used in the theme for the button is larger than expected.
    Screenshot-2021-04-02-221949

    Any idea how to apply a “nobr” css to the button?
    Thanks in advance!
    OC

    • This topic was modified 4 years, 8 months ago by Oclair.
    • This topic was modified 4 years, 8 months ago by Yui.
Viewing 2 replies - 1 through 2 (of 2 total)
  • linux4me2

    (@linux4me2)

    4 years, 8 months ago

    You don’t give a link to your site, so I can’t test it, but on my site, the “Add to Cart” buttons have a class of “tinvwl-txt,” so it works to add the following CSS:

    
.tinvwl-txt {
	white-space: nowrap;
}

    That approach means you don’t have to add a new class to the element. The downside on my site that I suspect may also affect yours is that it will cause other elements in the table to wrap.

    Alternatively, you could use the same class to change the font size:

    
.tinvwl-txt {
	font-size: small; /* or whatever size you want... */
}
    Thread Starter Oclair

    (@oclair)

    4 years, 8 months ago

    Hey thanks soo much @linux4me2 that’s a real huge help!

    I actually used this code instead because other elements would also move due to an effect associated with the buttons!

    .tinvwl-table-manage-list{
	white-space: nowrap;
}

    Happy Easter!
    OC

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Line breaks in “Add to Cart” button’ is closed to new replies.