Storyboard layouts flush with edge of screen, but shows gap in actual iPhone 7 Plus

Question

I have an iOS app coded in Swift and using storyboards. There's a "header bar" at the top of the view controller in the storyboard that should be flush with the left/right edges of the phone:

This behaves as expected in iPhone 6s. However, in the iPhone 7 Plus, it somehow shows a tap of maybe 2 millimeters on the screen, as if the autolayout does not work. According to autolayout, the leading space is -16. Setting it to 0 does not fix it.

Is there something I'm missing on autolayout that makes it work on all devices without showing gaps?

Answer 1

This is a bad way to give the constraint. You have given the constraint to the margin instead of the edge of the screen. Hence, it works fine in 6s but not in any plus device. Remove the constraint and re-apply them with Constraints to margin OFF.

And ya one more thing, when you give constraints with Constraints to margin off, make sure you give the constant as 0.0 instead of -/+16.0