Content area toggle secondary text line break <br> needed

Hola rockstars!

I’m using content area modal for thumbnails of my global block pop-ups here: http://dev.sbdagarna.se.loopiadns.com/talare/

I LOVE global blocks! Everything is great except for that I need a line break in the secondary text (title of the person) in order for it not to be cut off at some screen sizes or too small to read. < br > works in Cornerstone but not published front-end (< br > is visible front-end).

I really want to keep 4 columns/speakers per row as they get too big as 2 columns. 3 columns don’t work well on smaller screen sizes as the last one becomes a lonely and huge step child below the two above. I don’t want complicate it by using a custom grid as the client need to update these himself.

Is there a creative solution to solve this? Open for suggestions.

<3

Hello @Lobsterass,

Thank you for the very detailed post information. To resolve your issue, please set the “Content Flexbox” of the content area element to “Center Center”.
GyI7_CRLSYigt2wx3ViRJQ

You can go to Content Area > Toggle > Content Flexbox settings. If this is not helping, kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

1 Like

Hi!

That doesn’t really seem to solve the problem, unfortunately. The text doesn’t fit in one line.
It would be great to break it into two lines.

Hi @Lobsterass,

If you want your secondary text to break on the next line, you just need to uncheck the hidden checkbox for overflow and it will automatically break your secondary text.

Hope that helps.

Thank you.

1 Like

Hi!

Cool, that looks better! It’s not possible to somehow code it with CSS or something to always make it two lines though? I would love for the toggle/cards to be of the same height.

Hello @Lobsterass,

To make the toggle buttons the same height with the rest, you will need to set a minimum height for each of the toggle buttons.

We would to know if this makes sense to you.

Thanks, but that doesn’t really help much at different screen sizes. The best thing would have been to somehow force the subhead to break into two lines.

Hey @Lobsterass,

The Primary or Secondary Text in the toggle button doesn’t support HTML tags so there is no easy way to break the sub heading into two lines. the best solution here is to set the minimum height for each of the toggle buttons as Runel suggested.

Hope this helps!

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.