title: Spacer() swiftui leaves a white space
body: <p>I'm currently building a UI that has a big red 250px height box on the top that holds information and a scrollview underneath it. I build this all in a VStack(). I put a spacer() at the bottom of the VStack to push everything to the top of the screen. But it has a big white space between the red container at the top and the scrollview. Even though both don't have any padding(). Does anyone know how this is possible? This is my code:</p>
  <pre><code>import SwiftUI
  
  struct User: View {
      let columns = [
          GridItem(.flexible()),
          GridItem(.flexible()),
          GridItem(.flexible())
      ]
  
      var body: some View {
          NavigationView {
              VStack {
                  ...
                  code
                  ...
              }
              .frame(width: UIScreen.main.bounds.width, height: 250)
              .background(Color.red)
              .ignoresSafeArea()
  
              // somehow it has a white space here...
  
              ScrollView {
                  LazyVGrid(columns: columns, spacing: 2) {
                      ForEach((0...56), id: \.self) {_ in
                          Image(&quot;testimage&quot;)
                              .resizable()
                              .scaleEffect(CGSize(width: 1.0, height: 2.0))
                              .scaledToFit()
                              .frame(minWidth: 0, maxWidth: .infinity, minHeight: 50)
                              .cornerRadius(10)
                           }.padding(.bottom, 75)
                          
                      }
                      .frame(width: UIScreen.main.bounds.width)
                      .padding(.top, -10)
  
                  }
                  .navigationBarTitle(&quot;&quot;)
                  .navigationBarBackButtonHidden(true)
                  .navigationBarHidden(true)
                  
                 // this Spacer should push everything to the top
                  Spacer()
                  
              }
          }  
      }
      .navigationBarTitle(&quot;&quot;)
      .navigationBarBackButtonHidden(true)
      .navigationBarHidden(true)
  }
  }
  </code></pre>
  <p>Edit:
  To make my question better understandable I made this summery:
  I have build a VStack with 2 items in it. there is a big white space between the two and I don't know how to get rid of this white space. If I remove .ignoresSafeArea() the white space disappears. The thing is I need .ignoresSafeArea() to push the first item in VStack up. Does anyone know what I can do to keep .ignoresSafeArea() but get rid of the white space?</p>
  <p>I added a screenshot of the problem. I gave the scrollview a green background so that the white spacing between the VStack and the Scrollview is visable.</p>
  <p><a href="https://i.stack.imgur.com/6R4KX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6R4KX.png" alt="Screenshot of the example" /></a></p>