Archived topic

Adding border to mobile header using CSS

3 replies · Started by CRAIG on July 6, 2021

Viewing posts 1–4 of 4

July 6, 2021 at 5:31 am #1846269

Hi folks,

I have added a border below the site header using the following CSS:

.site-header {
border-bottom: 1px solid #ececec;
}

I wanted the same border to appear when viewing the site on a mobile device so I added the following CSS:

#mobile-header {
border-bottom: 1px solid #ececec;
}

Could you let me know what you think this should be?

July 6, 2021 at 5:56 am #1846291

Hi there,

they both work fine, you can combine the CSS rules into one like so:

.site-header,
#mobile-header {
    border-bottom: 1px solid #ececec;
}

Is that what you meant ?

July 6, 2021 at 6:32 am #1846339

Hi David,

I had already added the CSS to the site but the border wasn't displaying when viewing on mobile.

No idea why, but when I combined the code as you have suggested it has started to display properly when viewing via mobile

Thanks for your help

July 6, 2021 at 6:34 am #1846341

Glad to hear that

This archived topic is closed to new replies.