How to break work and text line in music demo

3 replies · opened May 31, 2022

AandygaofMay 31, 2022

Hi Sir / Madam,

I am in a project that need show some tracks and Album Title. But the metadata I get from some of the music file is a very long, no break string. like Henryk_Szeryng_Bernard_Haitink_Royal_Concertgebouw_Orchestra_Janos_Starker-Brahms_Double_Concerto_Be.

How can I break the string in below code?

in your sample code

<div class="songs-name track-name flex-grow-1 col-auto" style="margin-left: 2%;">Something About Love
Sian
</div>

I have try

<div class="songs-name track-name flex-grow-1 col-auto" style="margin-left: 2%;">
Henryk_Szeryng_Bernard_Haitink_Royal_Concertgebouw_Orchestra_Janos_Starker-Brahms_Double_Concerto_Be
Lost European
</div>

<div class="songs-name track-name flex-grow-1 col-auto" style="margin-left: 2%;">Henryk_Szeryng_Bernard_Haitink_Royal_Concertgebouw_Orchestra_Janos_Starker-Brahms_Double_Concerto_Be
Lost European
</div>

Per the picture I attached. Both of them do NOT work. Any sugesstion?

Thanks

Br

Andy

SSemicolon WebSTAFFMay 31, 2022

Hello,

Apologies for the Inconveniences caused!

Can you please provide us with a Live URL so that we can check out the exact issue and provide you with more accurate assistance on this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

AandygaofJun 1, 2022

Please go to

http://www.celaudio.com/canvas/track.html

It's fine on a large screen. Please zoom the browser, when it's smaller and smaller, you can see the track 01 and track 02 will beyond the screen. you can't see the menu icon on the right side.

two options are acceptable

I. multiple lines can handle all words.
II. two lines with ... in the end.

You know for some classical music. The track title can be very long. On smart phone, it's not acceptable if we only show first four or five words. all tracks may looks exactlly same :), Peoples never know what's that.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard