Z18
February 18, 2024, 6:57am
1
Hi, i just got some issue with my footer, my newsletter just got out of the alignment, i need some help because im getting tired
the code i put in assets > base.ccs
@media only screen and (min-width:1200px){
.footer-block--newsletter.scroll-trigger.animate--slide-in {
flex-direction: column;
margin-top: 0px;
width: -100%;
}
.footer-block__newsletter {
margin-left: auto;
margin-right: -100px !important;
}
ul.footer__list-social.list-unstyled.list-social {
align-self: flex-start;
margin-bottom: 0px;
}
.footer__content-top.page-width {
display: auto;
margin-top: 0px;
}
.footer-block__newsletter {
width: max-content;
}
.footer__blocks-wrapper.grid.grid--1-col.grid--2-col.grid--4-col-tablet.scroll-trigger.animate--slide-in {
gap: 0px;
}
}
@media screen and (min-width: 1200px) {
.footer-block__brand-info {
margin-left: -200px;
}
}
@Z18 could you please share your store URL?
Z18
February 18, 2024, 8:05am
3
@Z18 Added CSS and your footer structure is not as per requirement. Could you please keep all the divs of footer in the same div? so it’ll easily manage using the CSS
Z18
February 18, 2024, 7:11pm
5
ok, done, tell me if you need more information or something, thanks for replying me
@Z18 if we update the CSS then it overlaps some of the contents. Please check attachment
Z18
February 19, 2024, 8:44pm
7
looks nice, but yes, there is an overlap in the brand information, ¿it is a possibility to align every box in a proper way?
Z18
February 21, 2024, 7:28am
8
hey, i just solve the problem but thanks for try to help me
i use this code
@media only screen and (min-width:1200px){
.footer-block--newsletter.scroll-trigger.animate--slide-in {
flex-direction: column;
margin-top: -190px;
width: 1275px;
margin-bottom: 100px;
}
@media screen and (min-width: 1200px) {
.footer-block__brand-info {
margin-left: -175px;
}
}
the result:
1 Like
