Fooer menu first item not aligned - dawn theme

[blublu]

My footer menu in my dawn theme will not align the first element with others, also it isn't centered on the page (horizontally)

https://blublu.ca/password

Password is : saghoo

[BSSCommerce-B2B · Accepted solution]

@blublu ,

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid.

Step 3. Add this code above </body>

<style>
@media screen and (min-width: 750px) {
    .footer-block__details-content>:first-child .list-menu__item--link {
        padding-top: 0.5rem!important;
    }
}
</style>

Result:

[Made4uo-Ribe · Accepted solution]

Hi @blublu 

There is a code to prevent it not aligning.

Check this one. 

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

@media screen and (min-width: 750px) {
    .footer-block__details-content>:first-child .list-menu__item--link {
        padding-top: .5rem !important;
    }
}

And Save. 

result:

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[blublu · Accepted solution]

Works!!! Great!!  Now on mobile the menu is all stacked tough instead of nicely aligned.

[Sangeetanahar]

hello @blublu 

Please tell us clearly what you need in the footer

thanks

[BSSCommerce-HDL]

Hi @blublu,

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

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
.footer-block__details-content .list-menu__item--link {
    padding-top: 0.5rem !important;
}
</style>

Here is result :

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 😍

[blublu]

It isn't working, the footer menu's first item is still higher. Would it work if I deleted the menu item and created it anew?

[BSSCommerce-HDL]

@blublu, I think it's ok

[blublu]

Thank you!! Now on mobile the menu is all stacked tough instead of nicely aligned.

[BSSCommerce-B2B · Accepted solution]

@blublu , if you want this on mobile

Please change the previous code like this

<style>
.footer-block__details-content .list-menu__item--link {
    padding-top: 0.5rem !important;
}
@media only screen and (max-width: 768px) {
.footer-block--menu .footer-block__details-content {
  flex-direction: column;
}
</style>

[BSSCommerce-B2B · Accepted solution]

@blublu ,

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid.

Step 3. Add this code above </body>

<style>
@media screen and (min-width: 750px) {
    .footer-block__details-content>:first-child .list-menu__item--link {
        padding-top: 0.5rem!important;
    }
}
</style>

Result:

[blublu · Accepted solution]

Works!!! Great!!  Now on mobile the menu is all stacked tough instead of nicely aligned.

[blublu]

Now on mobile the menu is all stacked tough instead of nicely aligned. Can you help me please?

[Made4uo-Ribe · Accepted solution]

Hi @blublu 

There is a code to prevent it not aligning.

Check this one. 

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

@media screen and (min-width: 750px) {
    .footer-block__details-content>:first-child .list-menu__item--link {
        padding-top: .5rem !important;
    }
}

And Save. 

result:

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[Sangeetanahar]

hello  @blublu 

Go to online store ----> themes ----> actions ----> edit code ---->assets ----> section footer.css...>
add the code end of the file

.footer__blocks-wrapper .footer-block--menu {
  
    padding-top: 0.5rem !important;
   
}

result

Buy me a Pizza

If this was helpful, hit the like button and accept the solution.
Thanks