How can I center a banner in the Motion theme?

[jacqueee]

Hello! I need help because we want this banner to be on center. how to do that? i check on the settings its on center but its not on center here. what code should i use?

this is the website: https://staygoldenhi.com/collections/my-gems

2nd. when you view https://staygoldenhi.com/collections/my-gems

this will suddenly appear for 1- 2 sec and we want to get rid of that. pls help

[kazi_1]

Assets > dev_style.css > go to line #944 and remove “float:left” from this css

.template-collection .section-header {
padding-top: 0;
float: left;
}

[BrainStation23]

HI @jacqueee We have gone through your problem and found a solution.
Solution:
You can follow these steps to achieve your result
Go to online store → Edit code → dev_style.css file
And pest bellow code

.template-collection .section-header {
padding-top: 0;
 float: left !important; 
}

[arraynex]

Hello @jacqueee ,

It’s ArrayNex support team and glad to support you today.

I checked your website and found that the cause of this issue.

Your Solution:
You can follow these steps to achieve your result
Go to online store->Edit code->dev_style.css file
And pest bellow code

.template-collection .section-header {
padding-top: 0;
 float: left !important; 
}

If you require any further information, feel free to contact me.

Best regards,
ArrayNex Support Team

[Ihor-Sh]

Hello @jacqueee if you want it to look as on screenshot

• add such styling in dev_style.css:

.template-collection .section-header {
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    float: none;
}

2. You see this weird thing because of boost app. If you want to get rid of this - you need to abandon this app.