Ad

Alignment Of Basket In Shopify Mobile View

- 1 answer

I seem to be having an issue with aligning the basket on the top row when viewing my site on a mobile. For some reason, this sometimes appears at the top and sometimes appears at the bottom and I cant work out why this is and where I need to amend the code in order to fix this.

Would really appreciate if somebody could advise. I have attached an image to show this from a mobile and the site itself can be seen at:

[https://defineclothing.co/][enter image description here]1

Ad

Answer

I wonder why it even works sometimes ;)

This div <div class="col-xs-12 col-sm-12"> has a relative positioning and <div class="top-header "> an absolute positioning. Absolute positioned elements are positioned relative to the first positioned parent (which means relative, absolut or fixed). In order to achive the behaviour you want simply reset the relative positioning of <div class="col-xs-12 col-sm-12"> to position: static

<div class="col-xs-12 col-sm-12">
    <div class="top-header ">
        ....
    </div> <!-- End Top Header --> 
 </div>
Ad
source: stackoverflow.com
Ad