How do I prevent line breaks in type across all screen sizes?

[JonFrancisThompson]

Hi all,

I need some help figuring out an issue with line breaks in the body of a page when changing screen sizes. The site I am building posts a lot of poetry, and it is important that the lines stay in the same format no matter the size of the screen. The problem I’m having is that, especially when viewing the poetry on a mobile phone in portrait orientation, the lines are broken to accomodate a smaller screen size and reformatted accordingly.

My question is how can I prevent this? I’m thinking that I can use CSS to either contain whole paragraphs or that I may need to put the poetry inside of a div so that I can contain the div, but I’m not sure what the best way to accomplish this is.

I hope I’ve explained this well enough, and any help on this issue would be greatly appreciated. Please feel free to ask any related questions and I’ll do my best to provide the necessary info. Thanks.

[mldarshana]

Hi Jon,

Thanks for writing in! I have tried to check your site which is assigned to this Themeco account, but it seems that you have enabled coming soon mode.

From what I have understood, one option would be to use responsive text feature. You can refer to the following post for an example (https://theme.co/apex/forum/t/need-help-with-responsive-text-in-x-theme/13920/5?u=mldarshana).

Also check our hide during breakpoints feature to see other options you have (https://theme.co/apex/forum/t/hide-during-breakpoint-explained/17378).

You can also use custom CSS media queries to set a minimum and maximum for your elements, so that you should be able to control how it displayed on different devices.

If you’re having further issues, provide us with an example page URL so that we should be able to assist you.

Hope that helps.