Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 20, 2020 at 6:29 am #1239446
    aussiedropbear

    HI,

    I’m a little confused as to which code I should be using in the link below.

    Example of Logo left, Widget center, Menu right

    All I am wanting to reproduce is the logo left, center widget (maybe 2 of them side by side ), menu to right. Need small bar on top to remain for phone number and social icons I already have in place.

    Any assistance on what I should be adding and where would be greatly appreciated.

    Cheers
    John

    August 26, 2020 at 1:39 pm #1240915
    Ismael

    Hey John,

    Thank you for the inquiry.

    Did you add the css code that we provided from the documentation? You can place it in the Enfold > General Styling > Quick CSS field to the child theme’s style.css file.

    // https://kriesi.at/documentation/enfold/example-of-logo-left-widget-center-menu-right/#toggle-id-2

    Please sure that the Enfold > Header > Header Layout > Menu and Logo Position is set to Logo left, Menu right. And toggle the Performance > File Compressions setting after adding the css code.

    Best regards,
    Ismael

    August 28, 2020 at 1:29 am #1241342
    aussiedropbear

    Hi Ismael,

    Thanks for the reply.

    I’m ok where to add it I’m just not sure which code i am to be adding.. is it all of it? I don’t want to add bloat if I do not need it all.

    Thanks
    John

    August 31, 2020 at 2:00 pm #1242184
    Ismael

    Hi,

    Sorry for the confusion. This css code should be enough to align the widget to the center. 

    .responsive #top #header #header_main .inner-container .logo {
	order: 1;
	flex-basis: auto;
	min-width: 100px;
	max-width: 180px;
	z-index: 9;
}

.responsive #top #header #header_main .inner-container .widget {
	order: 2;
	flex-basis: auto;
	padding: 0;
	clear: none !important;
	justify-content: center;
	align-self: center;
	align-items: center;
	z-index: 1;
}

.responsive #top #header #header_main .inner-container .main_menu {
	order: 3;
	flex-basis: auto;
	align-items: center;
	align-self: center;
	height: inherit !important;
}

.responsive #top #header, .responsive #top #header #header_meta, .responsive #top #header #header_main .inner-container .logo, .responsive #top #header #header_main .inner-container .main_menu, .responsive #top #header #header_main .inner-container .widget:nth-child(3), #top #header #header_main .container.av-logo-container .inner-container {
	display: flex;
	position: relative;
}

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.