Change Header Height on Mobile Only Squarespace 7.1

Hi guys,

I'd like to change the header height on mobile only.

Website: www.thehomecollective.com.au

pword: Torquay1!

I have this code for header height on desktop:

.tweak-fixed-header .header .header-announcement-bar-wrapper {
    padding-top: 1.5vw !important;
    padding-bottom: 1.5vw !important;
}

Thanks.

Thanks a lot!

I am having the same issue. My mobile header is taking up too much space. Any help is greatly appreciated!

www.elizabethlovestoorganize.com

3 hours ago, Belizabeth said:

I am having the same issue. My mobile header is taking up too much space. Any help is greatly appreciated!

www.elizabethlovestoorganize.com

Use this code to Website > Website Tools > Custom CSS

@media screen and (max-width:767px) {
div.header-announcement-bar-wrapper {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}
[data-section-id="6631c9bd55a2de432d051a18"] {
    padding-top: 100px !important;
}
}

Thank you so very much, @tuanphan!! 🙂