How to stop word wrap ?

Site URL: https://bamboo-lime-face.squarespace.com/

Hi all! 

I have two issues, one of which might solve the other!

1: I am trying to stop the Available / Unavailable words on my website from wrapping onto two lines on different screens.

this is what it looks like on a laptop full screen (which I like)

As you can see, when the screen is smaller - i.e. when I have the Custom CSS section open on my computer -  the words wrap onto two lines

how do i stop the words from wrapping onto two lines?

2:  which might be a workaround for the first, is to make the text sit to the right of the image block - rather than below. I would like to do this for mobile view as well - is this possible?

The image block is a "CARD" design, so the text should actually be sitting to the right of the image anyway... im not sure why it isnt! 

Thanks in advance!

I answered your email. You can share the code for other members.

@hlzcp hi, I'm coming across the same problem. can you share the solution that Tuan emailed you please? thank you so much in advance!

On 1/7/2021 at 8:56 AM, Hannah_Kim said:

@hlzcp hi, I'm coming across the same problem. can you share the solution that Tuan emailed you please? thank you so much in advance!

If you share site url, we can give the exact code for your site. Each case will need different code.

I'm having the same issue.  I don't want the text to wrap on Mobile, because it breaks words in half. 

https://changeup.com/

Any code I could use in my custom CSS?  I think I just don't want words to break apart or punctuation to break apart (i.e., be put on the next line, like a hanging comma).

Thanks for your help!

James

On 5/5/2021 at 9:46 PM, jamesvgarrett said:

I'm having the same issue.  I don't want the text to wrap on Mobile, because it breaks words in half. 

https://changeup.com/

Any code I could use in my custom CSS?  I think I just don't want words to break apart or punctuation to break apart (i.e., be put on the next line, like a hanging comma).

Thanks for your help!

James

You mean chaneup works text? Add to Design > Custom CSS

/* prevent text wrap mobile */
@media screen and (max-width:767px) {
div#block-70013f55ef91ab95ea7a h1 {
    white-space: nowrap !important;
}
}

I'm having the same issue, it's fine on mobile but it's only when viewed in a smaller window on desktop/etc. Any specific code to assist with this? 

https://www.comercompanies.com/portfolio

On 4/21/2022 at 2:15 AM, Coco1234 said:

I'm having the same issue, it's fine on mobile but it's only when viewed in a smaller window on desktop/etc. Any specific code to assist with this? 

https://www.comercompanies.com/portfolio

Which screen size do you see problem?

I am having the same issue, but not just mobile. Is there a code to prevent all word breaks completely across the site, desktop and tablet too?

/* prevent text wrap mobile */
@media screen and (max-width:767px) {
div#block-70013f55ef91ab95ea7a h1 {
    white-space: nowrap !important;
}
}

On 1/12/2023 at 1:24 AM, brittanystatt said:

I am having the same issue, but not just mobile. Is there a code to prevent all word breaks completely across the site, desktop and tablet too?

/* prevent text wrap mobile */
@media screen and (max-width:767px) {
div#block-70013f55ef91ab95ea7a h1 {
    white-space: nowrap !important;
}
}

Use this

/* prevent text wrap mobile */
* {
    white-space: nowrap !important;
}