EN DE

Studio Agenturbüro Studio Agenturbüro

⏏︎ / Archive / 2023 / HTML whitespace control

HTML whitespace control

Created: 2023-09-08

Assuming you're wrangling with whitespace-critical code like

<a href="#">
    <!-- will display an additional space character -->
    my link text
</a>

you could either remove whitespace in your template

<a href="#">my link text</a>

or use your templater's whitespace control:

Handlebars

<a href="#">
    {{!-- will remove whitespace on each side of the tilde --}}
    {{~ text ~}}
</a>

see also: Expressions | Handlebars / Whitespace Control

Twig

<a href="#">
    {# remove whitespace on each side of the tilde #}
    {{- text -}}
</a>
<a href="#">
    {# remove whitespace on each side of the tilde – not newlines #}
    {{~ text ~}}
</a>
{# suppress whitespace in this region #}
{% spaceless %}
<a href="#">
    {{ text }}
</a>
{% endspaceless %}

see also: Twig – spaceless

more examples?

Gladly adding more propositions at this address: contact@studioagenturbuero.com – thanks!

--

Cover image: NASA, via New Old Stock




© 2020–25 Studio Agenturbüro — contact@studioagenturbuero.comimprint, privacy policy, credits.