Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #24002

    Hi there…

    I have to say that my website is coming along nicely and ive learnt so much. Using a class ive managed to install Bebas and call it up on a page block as well as have it scale as required responsively. Brilliant!!!

    Pushing it further I wonder if its relatively straight forward to implement ‘hidden’ line breaks that dont kick until a screen is certain sizes. I have a heading that is big & chunky. Looks great on big screens but as its on one line it loses impact on small screens – It needs splitting on to several lines.

    Ive attached a clipular link of what im after.





    Give a special class to the br tag. Then use media queries to display it to a certain screen width and hide it on another. Something like this

    Click here to add your own text<br class="br-nodisplay" />Text here.

    If you want to hide it on mobile view. You can add this on your custom.css.

    @media only screen and (max-width: 767px) {
    .br-nodisplay {
    display: none !important;




    Brilliant Ismael – as always


Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Responsive Text Scaling – Hidden line breaks’ is closed to new replies.