Header on Lawyer demo site not aligned

Support
#1

My previous thread closed but I uploaded the Lawyer demo site. I removed the vertical logo but now my header and nav bar aren’t centered.

You were able to help me by providing this code:

.masthead-stacked .x-brand {
margin-right: calc((50vw - (1170px / 2)) + 1em) !important;
}

It shifted it but it’s still not completely centered and it is completely off on other devices like tablets and mobile.

Please help, thank you!!

#2

And actually, if I could remove that left hand column where the vertical logo used to be altogether that would be great!

#3

Hi Adrien,

The logo and navbar is now center. Please clarify what is not the center.

That would actually destroyed the demo layout and will cause more issue.

Thanks,

#4

It is not centered on smaller devices like tablets and mobile devices. See example below.

#5

Hello Adrien,

To resolve your issue, please remove this custom css block:

.masthead-stacked .x-brand {
    margin-right: calc((50vw - (1170px / 2)) + 0em) !important;
}

You will need to replace it with this code instead:

@media(min-width: 980px){
    .masthead-stacked .x-brand {
        margin-right: calc((50vw - (1170px / 2)) + 0em) !important;
    }
}

We would love to know if this has worked for you. Thank you.

#6

Worked like a charm, you’re amazing thank you!!

#7

We are delighted to assist you with this.

Cheers!

#8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.