Align cart icon with with Menu and get rid of the white space.

Solved

Align cart icon with with Menu and get rid of the white space.

Only1mrsfragili
Trailblazer
169 3 51

Hello I would like to bring my cart down so that is aligned with my Menu and then get rid of the white space that will be left.  Can someone please help me?

 

Here is the preview link to my store.

 

https://jaagfnpmd82rbw2p-55024255114.shopifypreview.com

 

Thanks in advance,

Accepted Solutions (2)

PageFly-Henry
Shopify Partner
1184 335 294

This is an accepted solution.

Hi @Only1mrsfragili 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file styles.css

Step 3: Paste the below code at bottom of the file -> Save


.top-bar {

    position: absolute !important;

    width: 100% !important;

    margin-top: 10px;

}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

PageFly-Henry
Shopify Partner
1184 335 294

This is an accepted solution.

.top-bar {
position: absolute !important;
width: 100% !important;
margin-top: 10px;
}
@media (max-width: 767px){
.top-bar {
margin-top: 0 !important;
}
}

You can try with this code

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 6 (6)

PageFly-Henry
Shopify Partner
1184 335 294

This is an accepted solution.

Hi @Only1mrsfragili 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file styles.css

Step 3: Paste the below code at bottom of the file -> Save


.top-bar {

    position: absolute !important;

    width: 100% !important;

    margin-top: 10px;

}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Only1mrsfragili
Trailblazer
169 3 51

Worked perfectly! Thanks!

Only1mrsfragili
Trailblazer
169 3 51

Oh,  sorry there is a problem with the code.  When I scroll there is a gap between the menu and announcement bar.Screenshot 2024-04-15 at 3.04.53 PM.png

PageFly-Henry
Shopify Partner
1184 335 294

This is an accepted solution.

.top-bar {
position: absolute !important;
width: 100% !important;
margin-top: 10px;
}
@media (max-width: 767px){
.top-bar {
margin-top: 0 !important;
}
}

You can try with this code

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Only1mrsfragili
Trailblazer
169 3 51

No everything is fine 😃 

 

Thanks!

PageFly-Henry
Shopify Partner
1184 335 294

You are welcome 😊

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.