CSS to reduce the size of a JavaScript code block in the footer works, but footer still contains excess rows

I put a code block in the footer that uses a javascript function to automatically update the year in my copyright line of text. The code works perfectly, and I used the following css to resize the code block to the same height as the other text fields on that row.

/*footer copyright sizing*/
#block-yui_3_17_2_1_1674572709417_110386
{
  max-height:1rem
}

The row of text (that includes the code block) is intended to be at the very bottom of the page footer, but because the code block contains the javascript disclaimer about not being able to run while in edit mode, I cannot remove all the excess rows from the bottom of the footer. Beneath the row where I want my footer to end, there are 8 rows I cannot remove.

I tried setting a max footer height via CSS, but it cuts off the footer content from the top, not the bottom. How can I fix this to reduce the excess empty space at the base of my footer from the code block?

Thanks!

Add your JavaScript code to Settings > Advanced > Code Injection > FOOTER.

You may need to wrap your code in the following so that is loaded near the end of document load.

window.addEventListener ( 'DOMContentLoaded', ( ) => {

  [your code here]
  
  } );

Let us know how it goes.

16 hours ago, creedon said:

Add your JavaScript code to Settings > Advanced > Code Injection > FOOTER.

You may need to wrap your code in the following so that is loaded near the end of document load.

window.addEventListener ( 'DOMContentLoaded', ( ) => {

  [your code here]
  
  } );

Let us know how it goes.

Thanks for your help! When I add the JavaScript into the footer via code injection, it appears below the footer as plain text.

I preferred using the script in a code block so it would maintain the styling and alignment of the footer section theme, but I can't figure out how to resize the footer to reduce all the unused rows at the bottom of the footer due to the code block forcing additional grid rows.

Here's some visuals. The disclaimer in the code block forces the section to have too many rows at the bottom. I have the block resized via CSS, but I'm not sure how to remove the additional rows from only the bottom of the footer.

Quote

I preferred using the script in a code block so it would maintain the styling and alignment of the footer section theme

I suggest using a text block for your copyright and put your JavaScript where I suggest that would find the block and update the year.

I do not think there is a clean fix for the code block issue until SS fixes it.

On 1/25/2023 at 4:09 PM, creedon said:

I suggest using a text block for your copyright and put your JavaScript where I suggest that would find the block and update the year.

I do not think there is a clean fix for the script block issue until SS fixes it.

I see what you mean, thank you! I'll give that a try.

Hi!

I'm on the 7.0 version and have the York template.

I'm trying to reduce the size of the font in the footer,  as "normal" is too big.

Can anyone help me with a code line I can put in the CSS to get to this result?

Thank you,

10 hours ago, CV1 said:

Hi!

I'm on the 7.0 version and have the York template.

I'm trying to reduce the size of the font in the footer,  as "normal" is too big.

Can anyone help me with a code line I can put in the CSS to get to this result?

 

Thank you,

If you share link to your site, we can check easier

If anyone is discovering this now, I have a video and CSS that solves this issue:
https://schwartz-edmisten.com/blog/remove-extra-space-below-embeds