# Forms - Set as Raw HTML - Two Column Styling Not Applied

**URL:** <https://community.hubspot.com/t/forms-set-as-raw-html-two-column-styling-not-applied/107298>\
**Category:** APIs & Integrations\
**Tags:** forms\
**Created:** [May 16, 2024, 9:30am UTC](https://community.hubspot.com/t/forms-set-as-raw-html-two-column-styling-not-applied/107298 "2024-05-16T09:30:06Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![KGoethals](https://avatars.discourse-cdn.com/v4/letter/k/8797f3/32.png) [@KGoethals](https://community.hubspot.com/u/KGoethals)\
**Post date:** [May 16, 2024, 9:30am UTC](https://community.hubspot.com/t/forms-set-as-raw-html-two-column-styling-not-applied/107298/1 "2024-05-16T09:30:06Z")

</div>

Hi

We’ve embedded HubSpot forms on our website and enabled the setting “set as raw HTML”. Our developers added external CSS, but the two columns are unfortunately not appearing. Here’s an example: [https://www.equitone.com/en/contact/](https://www.equitone.com/en/contact/) You’ll see that there’s too much space between City and Postal Code, because we’re expecting two columns here.

Attached a screenshot of how the HubSpot forms looks like in HubSpot itself.

 ![2024-05-16 11_27_56-Form.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/3/5/350267172c51e981532a25b31723afaee8668ba3.png)

 ![2024-05-16 10_14_48-Work items - Boards.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/1/4161926ea9808a5ae0c977200ddb906851004b5a.png)

Does anyone know what we need to do in order to see the two columns like we’ve configured in HubSpot?

Thanks already for your help!

---

<div class="post-metadata">

**Author:** ![GRajput](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/grajput/32/102020_2.png) [@GRajput](https://community.hubspot.com/u/GRajput)\
**Post date:** [May 16, 2024, 3:03pm UTC](https://community.hubspot.com/t/forms-set-as-raw-html-two-column-styling-not-applied/107298/2 "2024-05-16T15:03:01Z")

</div>

Hi @KGoethals

We have shared the CSS property below just add this to your external css. Also, we have shared the screenshot of the result after using the shared CSS property - Desktop view & mobile view

```lia-code-sample
@media (min-width: 767px){
form fieldset.form-columns-2{
flex-wrap: nowrap!important;
}
}
@media (max-width: 767px){
form fieldset.form-columns-2{
gap: 2px!important;
}
}

```

**Desktop view**

 ![GRajput_0-1715871659668.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/d/8/d85535f4d1c2fcb99bcaf4f7a885c3232dcc8ca7.png)

**Moblie view**

 ![GRajput_1-1715871713138.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/c/d/cdb9673aaadb7d6286f3d25a40ae16b03747ebf3.png)

I hope this will help you out. Please mark it as **Solution Accepted and upvote** to help another Community member.  
Thanks!