Why does white space appear after hiding header and footer?

Why does white space appear after hiding header and footer?

Spanier865
Shopify Partner
5 0 3

Hey, I tried to use a unless command to hide the header, announcment bar and footer. It worked but above the content is a huge white space. What did I wrong and how can I fix it so that the content just fills the blank space?

I used this command

{% unless template == 'product.DAS TEMPLATE WAS ICH VERWENDE' %}

{% endunless %}

 

The first content is a rich text.

 

Bildschirmfoto_2023-05-21_um_18_16_29.png

Reply 1 (1)

NomtechSolution
Astronaut
1245 113 153
  1. Locate the code where the {% unless %} statement is placed. Make sure it's positioned in the correct location within the template.

  2. Check if there are any unnecessary <div> or other HTML elements surrounding the content. These elements may be contributing to the white space. Remove any unnecessary elements or adjust their styling as needed.

  3. If the white space persists, you can use CSS to control the spacing and height of the content area. In your theme's CSS file, add the following code:

 

/* Adjust the CSS selector based on the container element of your content */
.container-selector {
  margin-top: 0; /* Remove top margin */
  padding-top: 0; /* Remove top padding */
  height: auto; /* Allow the height to adjust dynamically */
}