# Adding code to Additional code snippets

**URL:** <https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535>\
**Category:** CMS Development\
**Tags:** css\
**Created:** [July 30, 2021, 2:08am UTC](https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535 "2021-07-30T02:08:49Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Philysgdy](https://avatars.discourse-cdn.com/v4/letter/p/a9a28c/32.png) [@Philysgdy](https://community.hubspot.com/u/Philysgdy)\
**Post date:** [July 30, 2021, 2:08am UTC](https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535/1 "2021-07-30T02:08:49Z")

</div>

Hi there

I am wanting to add some code to a rich text element using the settings\>additional code snippets. When I add the code it displays at the top of the page. What am I not doing correctly?

 ![Ann link code d1.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/f/b/fba78649ca0942cfc29fb51d2d7f8c4efb9be73f.png)

 ![Ann link d2.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/b/8/b86c4dc7144636fd011b0a49f952a9cb4aeb91ac.jpeg)

---

<div class="post-metadata">

**Author:** ![miljkovicmisa](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/miljkovicmisa/32/86357_2.png) [@miljkovicmisa](https://community.hubspot.com/u/miljkovicmisa)\
**Post date:** [July 30, 2021, 7:32am UTC](https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535/2 "2021-07-30T07:32:04Z")

</div>

Hello @Philysgdy , I believe I answered your previous question, in the answer I should have stated that your code must be wrapped in \<style\> tags like below, otherwise it renders as text, this is what you should put inside:

```lia-code-sample
<style>
 @media screen and (max-width: 576px){
 .connectLink {
 left: 4%!important;
 }
 }
</style>

```

If you have any other issue, don’t hesitate to ask.  
_ **If my answer helped you please mark it as a solution.** _

---

<div class="post-metadata">

**Author:** ![Philysgdy](https://avatars.discourse-cdn.com/v4/letter/p/a9a28c/32.png) [@Philysgdy](https://community.hubspot.com/u/Philysgdy)\
**Post date:** [July 30, 2021, 10:50am UTC](https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535/3 "2021-07-30T10:50:27Z")

</div>

Thank you that solves the riddle for me, I knew it was simple I just couldn’t connect the dots mentally.

---

<div class="post-metadata">

**Author:** ![miljkovicmisa](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/miljkovicmisa/32/86357_2.png) [@miljkovicmisa](https://community.hubspot.com/u/miljkovicmisa)\
**Post date:** [July 30, 2021, 11:00am UTC](https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535/4 "2021-07-30T11:00:27Z")

</div>

I would definatelly recomment all your css out of the rich text editor for two reasons.  
**1. Maintainability** : Its easier to maintain when all your code is in the same place.

**2. Readablility** : It’s a lot easier to read/write code in the snippet editor that in the rich text editor. It’s just cleaner.  
Also as a side note a **separation of concerns** is another reason, you will want your content to be decoupled from the styling, this is a broader topic that applies generally to web development, it is prefered to do that so you can maintain your code easily.

---

<div class="post-metadata">

**Author:** ![Philysgdy](https://avatars.discourse-cdn.com/v4/letter/p/a9a28c/32.png) [@Philysgdy](https://community.hubspot.com/u/Philysgdy)\
**Post date:** [July 30, 2021, 12:10pm UTC](https://community.hubspot.com/t/adding-code-to-additional-code-snippets/41535/5 "2021-07-30T12:10:05Z")

</div>

You are exactly right, I have been in WP territory where this hybrid doesn’t exist and I was trying to get my head around this CMS and this was my first attempt with it. **Separation of concerns** 😉 totally!!

I just sat back put it on paper and solved it as you suggested. Cheers