fix:improve footer responsiveness on smaller screens

[Prakash1185]

Problem

• The site footer layout was breaking on smaller screens and footer links were misaligned.

What changed

• Applied mobile-only layout adjustments to the footer
• Centered footer content on small screens
• All the changes made does not affect the desktop layout.

Before

After

[Prakash1185]

Hi @martin-g , this PR improves footer responsiveness on small screens. Please take a look.

[martin-g]

Suggested change

	}
	}

[martin-g]

Why 996 ?
https://getbootstrap.com/docs/5.0/layout/breakpoints/ uses 992

[Prakash1185]

Updated the breakpoint to 992px to match Bootstrap’s lg breakpoint.

[martin-g]

Suggested change

text-align: center;

This one seems redundant. The one at line 49 will override it anyway.

[Prakash1185]

Agreed, removed the redundant text-align rule.

[martin-g]

This will match only if "col-..." is the first item in class="...", e.g. class="col-3", but it won't match for class="another col-3"

[Prakash1185]

Thanks for pointing this out. Updated the selector to avoid relying on class name prefixes.

[martin-g]

!important is usually not recommended. Did you try without it ? E.g. with more concrete selector.

[Prakash1185]

Removed !important and adjusted the selector accordingly.

[martin-g]

Is this needed ?
<img> is an inline element, so the text-align: center from line 49 should be enough.

[Prakash1185]

removed the unnecessary img centering rule.

[Prakash1185]

Thanks for the detailed review! I’ve noted the points and will address them shortly with an updated commit.

[Prakash1185]

Thanks for the review! @martin-g . I’ve pushed an update addressing all the changes you suggested and the final footer layout is same as with the previous css code. Please let me know if this looks good now.

[martin-g]

Thank you, @Prakash1185 !