Center Logo, Menu Above and Right - Support | Kriesi.at

Tagged: center logo, sticky header

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts
May 12, 2020 at 11:55 pm #1212411

MLA18
Participant

Hello Support,

I have searched the forums and documentation and did not have any luck finding a solution. What I am attempting to do is the following:

Center Logo, Menu above and to the right (I have attached an example). Also is it possible to have a centered logo which will remain as sticky when the sticky header is activated?

Thanks in advance!

May 14, 2020 at 2:22 pm #1212956

Victoria
Inactive Moderator

Hey MLA18,

Here are the available header layouts for you to consider:

Header

If you need further assistance please let us know.
Best regards,
Victoria

May 14, 2020 at 3:23 pm #1212966

MLA18
Participant

That response doesn’t answer any of the questions that I asked. Are you saying there is no way to achieve what I am looking for?

Also, what about getting the logo to remain in the sticky header?

May 19, 2020 at 1:13 pm #1214329
Ismael
Moderator
Hi,

Sorry for the confusion. You can place the logo at the center by setting the Enfold > Header > Header Layout > Menu and Logo Position settings to the last option. This is going to render the menu above the logo. We can then use the following css to adjust the position of the menu and move it to the right.
```
.html_header_top.html_logo_center #header_main_alternate .main_menu ul:first-child {
	float: right;
}
```
Add it in the Quick CSS field or the child theme’s style.css file.

Best regards,
Ismael
May 19, 2020 at 4:08 pm #1214363

MLA18
Participant

Thank you, Ismael!

That is what I was trying to achieve for the main menu. However, I still am not finding any documentation or notes as to how to make the whole header area fully sticky? Right now only the main menu is sticky. I am trying to make the whole header area and centered logo be sticky as well.

Any advice you could provide would be greatly appreciated.

Thanks!

May 25, 2020 at 7:45 am #1216002
Ismael
Moderator
Hi,

Thank you for the inquiry.

This css code should make the header sticky and add a top margin above the first section.
```
.av-section-bottom-logo.header_color + div {
	margin-top: 88px;
}

.av-section-bottom-logo.header_color {
	position: fixed;
	width: 100%;
	background: #ffffff;
	z-index: 1001;
}
```
Best regards,
Ismael
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.