'How do I know if I made auto-layout good enough to fit every device?

In my case:

When I set device to be Iphone SE and run simulator on Ipod touch 7th gen everything is normal and every element is where it should be.

But if I change device to iPhone 11 and run on same simulator (IPod touch 7th gen) almost everything is messed up. Should I always set device to be same as simulator device or it doesn't matter?

enter image description here. enter image description here

The title of this question is also my question: Does Xcode storyboard device and simulator needs to be same ?

Edit:

The upper stack view(username; password) is causing my problem and here is how I made it. First I've added stack view then inside I put two textFields.

Stack view components: Axis: Vertical Alignment: Fill Distribution: Fill Equally Spacing: 30

Stack view constraints:

Alignc Center X to: Safe Area

Top Space to: image(image above stack view) Equals: 17.6

Aspect Ratio to: Superview Instrinct Size(Default) and also everything else is default

Username label has only one constraint and its aspect ratio = 6:1

Button customization is making the problem and here is what I've used:

  class customElements{
   static func styleTextField(_ textfield:UITextField) {
    
    // Create the bottom line
    let bottomLine = CALayer()
    
    bottomLine.frame = CGRect(x: 0, y: textfield.frame.height - 2, width: textfield.frame.width, height: 2)
    
    bottomLine.backgroundColor = UIColor.init(red: 48/255, green: 173/255, blue: 99/255, alpha: 1).cgColor
    
    // Remove border on text field
    textfield.borderStyle = .none
    
    // Add the line to the text field
    textfield.layer.addSublayer(bottomLine)
    
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source