How to add code without a code block

I'm trying to create a homepage for a site that is very stripped down: just a full bleed gallery with an SVG logo above centered horizontally and vertically above. 

So far I've been able to do this by  using "display: none" to hide the header and footer, adding the SVG using a code block, and positioned and styled the SVG logo using CSS in the page header code injection. 

Everything seems to be working fine, except there is a blank white space below the gallery. The goal is to have the gallery full width and full height, and no scrollbar/ability to scroll. I think the issue is the section I had to add below the gallery to place the code block. 

Is there any way to avoid this? I wish I could somehow just add the SVG code into the html without using a section. As far as I can tell, it's impossible to add a code block to the gallery section. 

I tried using header CSS to hide the section div containing the code block, but that removes the custom code along with it. 

I feel like I'm so close, but this is driving me crazy. I'm open to any suggestions. Thank you so much in advance. 
 

not possible in squarespasce.

Please post the URL for a page on your site where we can see your issue. For us to see the URL you need to include the link in the content of your post. The URL field the forum software provides is not shown to us.

A link to the backend of the your site won’t work for us, i.e. a URL that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

You may find How to post a forum question post useful.

We can then take a look at your issue.

Thanks, @creedon (and everyone else.) Here's a link to the page in question: 

https://corn-bluebird-xx9w.squarespace.com/home-test

The rest of the site is fine—the issue is only on this home page. 

Many thanks!

Your site is private.

Please read my previous post to set up a site-wide password.

@creedon 

Ack! Sorry, I didn't realize it was set to private. 

I just set up a password. The password is "forum" 

Here's the link again: https://corn-bluebird-xx9w.squarespace.com/home-test

Many thanks.

Set the Gallery section height to large.

Set the section with your SVG code height to medium.

Replace your CSS, make a copy somewhere, with the following to Page Settings > Advanced > Page Header Code Injection for the page. Please see per-page code injection.

<style>
  
#header,
#footer-sections {

  display : none;

  }

.page-section:nth-child( 2 ).section-height--medium:not( .content-collection ):not( .gallery-section ):not( .user-items-list-section ) {

  min-height : unset;
  
  }

.page-section:nth-child( 2 ).vertical-alignment--middle:not( .content-collection ):not( .gallery-section ):not( .user-items-list-section ):not( .editmode-changing-rowcount ).section-height--medium > .content-wrapper {

  padding : 0;
  
  }

.page-section:nth-child( 2 ).section-height--medium:not( .content-collection ):not( .gallery-section ):not( .user-items-list-section ) .fluid-engine {

  display : block;
  
  }

/* body { height: 100vh!important;   or  min-height: 100vh!important; } */

.centeredlogo { 

  fill : #FFFEFC;
  left : 50%;
  max-width : 600px;
  position : fixed;
  top : 49%;
  transform : translate( -50%, -50% );  
  width : 30vw;
  
  }

  /* HIDDEN ELEMENTS ON MOBILE */ 
/*@media only screen and (max-width: 768px) {.centeredlogo {width: 75%;}
}*/

@media screen and (max-width: 800px) {
  .centeredlogo {
    width: 62%;
  }
}  
  
</style>

Let us know how it goes.

@creedon Thank you so much for taking the time on this. So kind. 

I followed your steps, but it is still having the same issue but with more white below the gallery section. Maybe I misunderstood something? I checked and made sure the gallery height was set to L (and full bleed.) For the section with the code block, I had to set it to "fill screen" to set the height to Medium. Is that correct? 

I then replaced the header code injection CSS with the one you provided. Did I miss anything? 

I made a copy of the previous page before doing this. Here is the result: 

https://corn-bluebird-xx9w.squarespace.com/home-test-forum

@creedon you are my hero! That did the trick! Thank you so, so much. Everything seems to be working:

https://corn-bluebird-xx9w.squarespace.com/home-test-forum

I wish I could understand what you did there, but I'm sure it's above my pay grade. I truly appreciate it. I spent an hour with tech support this morning and they were no help. 

10,000 thanks! 

Setting a section to large makes it the height of the viewport.

Setting the section with code to height medium wasn't strictly necessary but I've gotten into the habit of leaving section settings at the defaults when making these kinds of spacing changes via CSS.

The basic trick here for the section with code is to override any element that is adding height or padding so that the section has an effective height of zero.

@creedon Sorry, just thought I'd check back in because I noticed it's not working on mobile. Is that just a necessary limitation, or did I do something wrong? 

Again, all my thanks!

Quote

I noticed it's not working on mobile. Is that just a necessary limitation, or did I do something wrong?

I have updated the code. Give it a try and let us know how it goes.

You are the best. It works. Thank you so much, my friend!