Archived topic
Replicating header element from site library peak theme.
6 replies · Started by Syed on April 29, 2020
Hello, the heavyweights of the lightweight world.
Hope you are doing well. For the past two days, I am stuck at something.
So basically I am using peak theme from the site library.
The theme itself comes with some pre-installed header elements namely Global Header and Home Page Hero.
Both these elements work awesome on desktop and mobile.
Here is an example of Global header:
https://99pmarket.com/privacy-policy/
Here is an example of the home page header.
so whats The problem? Actually I am trying to achieve the same header elements look creating a new header. even though I select the same options as for global header and home page header. My header elements doesnt look same.
Here is an example of what I created. I selected the same options as other pre-built headers but results are not same
https://99pmarket.com/test-page/
How can I achieve same look out as other two headers? Do i need to use some CSS class?
Your help will be much appreciated.
Kind regards.
Hi there,
The top and bottom padding unit are different.
The working two page heros are using % and the not working one is using px.
Leo thanks for your response mate.
Is there any easy way to fix this. forgive me but I am an absolute beginner. for example, the styling of working ones to be applied to non-working one?
I tried using the custom class of working element header "page-Hero" using element classes but it doesnt work
Your help will be much appreciated.
Kind regards.
Ohk I found it.
Thanks Bro.
You are a hero
No problem :)
Leo,
Just a quick question. How did you figure that out? did you use some kind of tool? I was using firefox inspect tool and weren't able to figure it out.
Kind regards.
Hi there,
Leo would have used the browser inspect ( developers tools ).
If your Right Click > Inspect the Hero. Then in the Elements list look for and select <div class="page-hero"> you will be able to see the Styles for that element.
