A little trick for responsive markup
Some time you have big text that is just fine when viewing it in full browser width but it can get cluttered when reduced on a mobile or tablet view using media queries on the css, for example it won’t be that nice when is not displayed as a single liner per tense. Here an example from the beyounic website I am making responsive. As you can see we have an header made up of 3 single liner tenses.
Making it fluid and reducing font size make it a bit weird, so i wanted to just insert a white space among each tense when reduced in width. To solve this just add an empty div for example <div class=”spacer”></div> after each <br />. Then on targeted css give this div class an height. The result should then look something like this:
