Default Top Line Bar Below Breadcrumb Section As Seen on Demo

[fintechjobs]

Hi,
When i use the original header of the X site (Integrity Stack), i can see a wide bar below Breadcrumb section (See the screenshot)

But when i use pro header, it doesn’t appear anymore.
How can i have this wide line on the X pro too same to same?

Also, see at the bottom of the site where content area is ending:

How i can bring similar pattern in X pro?

[lely]

Hi @fintechjobs,

Thank you for the screenshots. Those line can be added on the BAR. Please inspect bar and then set Bottom border. On footer bar, you can then add top border in it.

We do recommend for you to watch our videos about header. Please also subscribe to our youtube channel. Those header can be easily created using the PRO header builder.

Hope this helps.

[fintechjobs]

Hi @lely

Yes, that’s great.
I have got it. Thanks for your help.

The only thing is that i have not been able to bring a similar effect like that bar. It seems, i am using wrong color value for this border.

I can see, you have used a red shadowed transparent color.
Can i know the exact “rgba” color code which can bring similar effect as seen on the screenshot attached below?

[lely]

Hi @fintechjobs,

You’re always welcome!

border-bottom: 1px solid rgba(0,0,0,0.1);
box-shadow: 0 1px 0 0 rgba(255,255,255,0.715);

rgba(0,0,0,0.1) for border color.
rgba(255,255,255,0.715) for box shadow

See this : https://screencast-o-matic.com/watch/cYe1hDxXVY

The following guide will help you to inspect element styles:

• Intro to CSS - https://goo.gl/mFuWQT
• How to get CSS selectors - https://goo.gl/BmoH39
• Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa