Align Elements in group when screen resizes

[neal.aaron.m]

Hi there,
I’ve create a few buttons in my top nav for “Sign Up” and “Log In”. When a screen is under 1200px, I’ve set the Log In button to hide and using hiding rules, and an “account” icon is set to appear in its place. All of this is working as expected, however, I having trouble getting the “Sign Up” button to shift right to align more closely with the “account” icon. It eventually aligns, but only at 300px.

Current configurations:

Parent container

Sign Up Button

Log In Button

Current result

[cmarchan]

Hello @neal.aaron.m

Create a second group of elements where you have the signup button closer to the icon. Show it conditionally while hiding the current group. Make sure you copy/paste with workflows so that you do not have to create them manually.

Hope this helps.

[boston85719]

Try setting on the signup button a collapse margins when and make it set up so it is when the login button is hidden. This could make it so the signup button stretches to meet the user icon. To ensure the signup button doesn’t encroach too much on the user icon, put the user icon into a group and set up the margins there.

That way when the signup button margins are collapsed, it will reach the group surrounding the user icon.