moving sizes under price

[shivampatel623]

{% if product.available %}
      <div class="product-card__price">
        {% if product.compare_at_price > product.price %}
          {% comment %}
            Product is on sale
          {% endcomment %}
          {% if product.price_varies %}
            {% assign sale_price = product.price | money_without_trailing_zeros %}
            {{ 'products.product.on_sale_from_html' | t: price: sale_price }}
          {% else %}
            <span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
            <s class="product-card__regular-price">{{ product.compare_at_price | money_without_trailing_zeros }}</s>

            <span class="visually-hidden">{{ 'products.product.sale_price' | t }}</span>
            {{ product.price | money_without_trailing_zeros }}
          {% endif %}

        {% else %}
          {% comment %}
            Not on sale, but could still have varying prices
          {% endcomment %}
          {% if product.price_varies %}
            {% assign price = product.price | money_without_trailing_zeros %}
            {{ 'products.product.from_text_html' | t: price: price }}
          {% else %}
            <span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
            {{ product.price | money_without_trailing_zeros }}
          {% endif %}
        
        {% assign sizes = ' ' %}
    		{% for variant in product.variants %}
    			{% if variant.available %}
      				{% assign sizes = sizes| append: variant.options[0] | append: '_' %}
    			{% endif %}
 			 {% endfor %}
      
		{% assign sizesArr = sizes | split: '_' | uniq %}

		{% for size in sizesArr %}
 			<span>{{ size }}</span>
		{% endfor %}

       {% endif %}
      </div>
    {% else %}
      <div class="product-card__availability">
        {{ 'products.product.sold_out' | t }}
      </div>
    {% endif %}
  </div>

I am having trouble showing which sizes are in stock. I managed to show them but I am trying to get them on a new line below the current price. 

The result for a product for example will be:

$50 M L 2XL 

I would like it to read:

$50

M L 2XL

Thanks

[shivampatel623]

I have tried adding a new line using \n and append: \n and that did not work.

[shivampatel623 · Accepted solution]

Solved using <br/> between the two!