How to move footer content down within footer element (Dawn theme)

Technical Q&A
,

Topic summary

A user is attempting to customize the Dawn theme footer by positioning content relative to an image. They’ve tried using margin, padding, and translate properties but are struggling to maintain proper positioning across different screen sizes.

Current approach:

  • Using custom CSS with negative margin-top (-142px) and margin-bottom (80px) on the footer logo image
  • The CSS centers the logo and sets max-width to 100%

Status:
A respondent confirmed the customization is possible but will require code modifications. The discussion remains open with no specific solution provided yet. The attached screenshot shows the current footer layout issue.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

Hi,

I am trying to customize the footer in the Dawn Theme, and am having issues with moving the content of the footer relative to the position of an image within said element. Trying changing Margin, Padding, and Translate all work, but not in a way that keeps relative position based on screen size.

Any help would be appreciated,
Thank you!

rrsanders_0-1741037449645.png
rrsanders_0-1741037449645.png629×376 53 KB

Custom CSS to insert the footer into the image is:

.footer-logo {
  width: 100%;
  text-align: center; /* Adjust alignment as needed */
}
.footer-logo img {
  max-width: 100%;
  height: auto;
  margin-top: -142px;
  margin-bottom: 80px;
}
2

Hi @rrsanders ,

Yes, it’s possible to do that, but modifications to the code will be required.