Footer Menu Upper Line Doesnt Appear on Mobile

Footer Menu Upper Line Doesnt Appear on Mobile

berkeyazer
Excursionist
28 2 3

Hello Dears,

 

I would lilke to ask your help to add an upper line to my footer menu in mobile version.

I have it for desktop version but it does not appear on mobile, please see below example line.

I would like to put the same one to the location of red dots.

 

https://7hills.shop/

yellow123456789x

 

 

berkeyazer_0-1719147091692.png

berkeyazer_1-1719147161151.png

 

Replies 2 (2)

BSSCommerce-HDL
Shopify Partner
1060 362 432

Hi @berkeyazer

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

BSSCommerceHDL_0-1719147658288.png

 

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_1-1719147663667.png

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

 

@media only screen and (max-width: 767px) {
  .footer__column.footer__column--info {
    position: relative;
  }

  .footer__column.footer__column--info::after {
    content: '';
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 1px;
    background-color: black;
  }
}

 

Here is result: 

BSSCommerceHDL_2-1719147699883.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

 

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

Spac-es
Shopify Partner
389 112 135

Add this code in your base.css file:

.footer__content-top.page-width {
  border-top: 1px solid #00000036;
}

Result:

result.PNG

Any donation is welcome! https://www.buymeacoffee.com/spacescoffee Thanks in advance!