# Make Static Header Banner Smaller

**URL:** <https://community.hubspot.com/t/make-static-header-banner-smaller/74256>\
**Category:** CMS Development\
**Created:** [February 1, 2023, 3:17pm UTC](https://community.hubspot.com/t/make-static-header-banner-smaller/74256 "2023-02-01T15:17:30Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![HBarden](https://avatars.discourse-cdn.com/v4/letter/h/278dde/32.png) [@HBarden](https://community.hubspot.com/u/HBarden)\
**Post date:** [February 1, 2023, 3:17pm UTC](https://community.hubspot.com/t/make-static-header-banner-smaller/74256/1 "2023-02-01T15:17:30Z")

</div>

Hi all,

I’m having some issues with the static black banner being way too wide when I scroll. It doesn’t appear like this on a larger computer screen but I can barely see the content this way.

Is anyone able to direct me to the code or help me make this smaller?

Link is: [https://biild.co.uk/](https://biild.co.uk/)

Thanks.

 ![Screenshot_20230201_151541.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/a/4ad72ae556f25f472844c1d81a1b71332723c900.jpeg)

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [February 1, 2023, 3:28pm UTC](https://community.hubspot.com/t/make-static-header-banner-smaller/74256/2 "2023-02-01T15:28:01Z")

</div>

Hi @HBarden,

open the _theme-override.css_ in your theme folder and search for _header.header_ class which is inside the _media-query (min-width:992px)_

there’s a padding information - if you change the first number the header will be smaller.

_Here’s the code how the browser displays it:_

```lia-code-sample
@media (min-width: 992px){
...
header.header {
 background-color: transparent;
 padding: 40px 20px;
}
...
}

```

If there’s a hubl like {{ theme.header.desktop.padding }} like this

```lia-code-sample
@media (min-width: 992px){
...
header.header {
 background-color: transparent;
 {{ theme.header.desktop.padding.css}}
}
...
}

```

you can edit the height/padding directly from the theme settings here:

settings(cog icon in top right corner) → website → theme -\>YOUR THEME NAME

best,

Anton

---

<div class="post-metadata">

**Author:** ![HBarden](https://avatars.discourse-cdn.com/v4/letter/h/278dde/32.png) [@HBarden](https://community.hubspot.com/u/HBarden)\
**Post date:** [February 1, 2023, 3:36pm UTC](https://community.hubspot.com/t/make-static-header-banner-smaller/74256/3 "2023-02-01T15:36:49Z")

</div>

Thank you so much!
