Extend two buttons horizontally across all AutoLayout devices

Question

I'm trying to have two buttons side by side that look correct on all devices, but no matter what restrictions I seem to add, I am having problems like this (one button more than the other):

Any ideas on what I'm doing wrong by adding restrictions? I do not use the code for this, I just do it through InterfaceBuilder in the Storyboard.

A set of restrictions:

Answer: leading space, lower space, height is: 45, button "Go to delete"

Delete: trailing space, lower space, 32: 9 ratio, height is: 45, leading to Btn answer

Answer 1

If you select both buttons, go to Editor> Output> Width Equal. Then set the height, leading / trailing space, the space between the buttons and the bottom space.

Answer 2

For me, add the following restrictions

• The Reply button adds the leading space and lower space for viewing
• Add Y center constraint to remove button
• Then align the upper and lower space to remove the button, and add a close button to delete.
• After that, click the "Delete" button to add the lower space and the final space.

I had similar operations on one of my views, please see this image for more information.

Happy Codding :)

Answer 3

You need to add a constraint for equal width, as well as remove the “32: 9” ratio constraint, which currently sets the width of the “Delete” button without the width set for the “Reply” button. This is what causes the problem.

If you still have leading and trailing edges attached to their respective sides of the container view and set the space between them to zero, then you should be good.