-
Posts
-
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.
http://www.clipular.com/c?6544137=EVx8AxkV9VIetmvq_Fe2CK_cZBM&f=4970845d4c8ac5ae94a7b8ee6dd23291
Cheers
Andy
Hi,
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;
}
}Regards,
Ismael
- The topic ‘Responsive Text Scaling – Hidden line breaks’ is closed to new replies.