Archived topic

Border below header isn't visible on mobile

3 replies · Started by Ales on October 17, 2021

Viewing posts 1–4 of 4

October 17, 2021 at 3:49 pm #1966602

Hi,

I use this CSS code to show border below my header:

.site-header {
  border-bottom: 1px solid #DDD;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

But the problem is that the same border isn't showing on mobile.

I have enabled "Mobile Header".

How can I make the border show up on mobiles too?

Thanks a lot!
Ales

P.S. In the "Private information" field, you have my website URL

October 17, 2021 at 4:05 pm #1966608

Hi there,

Edit your CSS to this:

.site-header, #mobile-header {
    border-bottom: 1px solid #ddd;
    box-shadow: rgb(99 99 99 / 20%) 0 2px 8px 0;
}

October 17, 2021 at 4:20 pm #1966627

Hi Leo,

Thanks a lot for your code, but I don't think it works.

I tried to clear the cache and use incognito mode on my mobile, but the border is still not there.

Can you please check it on your end?

Thanks!
Ales

October 17, 2021 at 4:38 pm #1966637

It should definitely work as I tested it.

I'm still seeing the old CSS being added:
https://www.screencast.com/t/VbL7l4PZ9XH

Can you clear and disable WP Rocket for now?

This archived topic is closed to new replies.