Different width for columns in a dnd-template

[ewice]

Good afternoon,
when creating a dnd-template in the design manager a width attribute can be given to the element. But if I want to position two modules next to each other with different widths, this does not work. Each element takes up exactly half of the available space. Where is my mistake?

{% dnd_area 'dnd_area' class='body-container body-container--landing-page', label='Main' %}
          {% dnd_section 
            max_width=1506,
            vertical_alignment='MIDDLE'
          %}
            {% dnd_column
              offset=0,
              width=4
            %}
              {% dnd_row %}
                {% dnd_module path='@hubspot/linked_image' %}
                {% end_dnd_module %}
              {% end_dnd_row %}
              {% dnd_row %}
                {% dnd_module path='@hubspot/rich_text' %}
                  {% module_attribute 'html' %}
                    <h3>Feature one</h3>
                    <p>Use text and images to tell your company’s story. Explain what makes your product or service extraordinary.</p>
                  {% end_module_attribute %}
                {% end_dnd_module %}
              {% end_dnd_row %}
            {% end_dnd_column %}
            {% dnd_column
              offset=4,
              width=8
            %}
              {% dnd_row %}
                {% dnd_module path='@hubspot/linked_image' %}
                {% end_dnd_module %}
              {% end_dnd_row %}
              {% dnd_row %}
                {% dnd_module path='@hubspot/rich_text' %}
                  {% module_attribute 'html' %}
                    <h3>Feature two</h3>
                    <p>Use text and images to tell your company’s story. Explain what makes your product or service extraordinary.</p>
                  {% end_module_attribute %}
                {% end_dnd_module %}
              {% end_dnd_row %}
            {% end_dnd_column %}
          {% end_dnd_section %}
        {% end_dnd_area %}

[stefen · Accepted solution]

@ewice your HubL looks correct from my first glance. It could be an issue with your CSS that's being used for your layout.css / row-fluid span1-12 classes. Do you have a preview link?

[ewice]

I forgot to link the layout.css.

Thanks