Announcement bar struggles

[RednahPowderDye]

Hi,

I’ve made my header transparant with the code below. However, now my announcement bar forever does not look how I want it to. I need much less space above and below the text. Also it shoul dnot overlap with my header. And I want it to be fully shown on mobile. Can someone help? My store link: https://rednah.com/

.shopify-section-group-header-group.announcement-bar-section{ height: 40px; } .header-wrapper{ position: absolute; width: 100%; background: transparent; } .header-wrapper .header{ margin-top: 25px; }

{% endif %}

[vm-web]

@RednahPowderDye

try this code

[RednahPowderDye]

Thank you very much for this! Just one thing. How can I remove the space above and below the text as much as possible?

[vm-web]

@RednahPowderDye

Please add the following css code to your assets/base.css bottom of the file.

.announcement-bar__message {
    padding: 0.5rem 0 !important;
    min-height: 0.8rem !important;
}

Thanks!

[RednahPowderDye]

I tried. But it didn’t change (see attached where I pasted the code). Perhaps something else I can try?

[vm-web]

@RednahPowderDye

closing bracket missing please check follwing code and screenshot.

100% {
    transform: translateX(100%) scaleX(0);
  }
}

.announcement-bar__message {
    padding: 0.5rem 0 !important;
    min-height: 0.8rem !important;
}

Thanks!

[RednahPowderDye]

Hi,

I tried. This also does not work. Any other suggestions maybe? Also all of a sudden my colors in mij editing screen look different than on the actual website. So my menu now is brown but should be white.