coding my website

I want the footer navigation menu to align with the newsletter and the social media icon to be under the newsletter then the footer nav.menu to be more smaller in the mobile version

https://sunfadednyc.com/

Hello, @maria323

  1. Go to Online Store

  2. Edit Code

  3. Find theme.css/base.css file

  4. Add the following code in the bottom

.footer-container {
    display: flex;
    justify-content: space-between; /* Adjust spacing as needed */
    align-items: center; /* Align items vertically */
}
.newsletter {
    display: flex;
    flex-direction: column; /* Stack elements vertically */
}
.social-media {
    margin-top: 10px; /* Add some spacing from the newsletter */
}
@media (max-width: 768px) {
    .footer-nav {
        font-size: 12px; /* Make text smaller */
        text-align: center; /* Center align for better readability */
    }
    .footer-container {
        flex-direction: column; /* Stack all elements vertically */
        align-items: center;
    }
    .social-media {
        margin-top: 20px; /* Add spacing for separation */
    }
}

Thanks!

the exceed code size limit

try this one

.footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.newsletter {
    display: flex !important;
    flex-direction: column;
}
.social-media {
    margin-top: 10px !important; 
}

@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center !important;
    }
    .footer-nav {
        font-size: 12px !important; 
        text-align: center;
        margin-top: 10px;
    }
    .social-media {
        margin-top: 20px !important;
    }
}

not working yet

hello