Button Text, Vertical Alignment problems

Design help General
1

I’m having problems with getting the text on a button vertically aligned for the largest breakpoint size. This button looks fine for every breakpoint except this one, where the text is below center for some reason.

This is for the “Start Your Career” button in the top nav.

This is probably a painfully simple solution, but I’ve tried everything and can’t figure this out.

Thanks!

(Webflow - Jeff's Outdoor)

2

Hi there,

To fix the button text alignment issue on your largest breakpoint, follow these steps:

  1. Navigate to your largest breakpoint in the Designer
  2. Select the button element you want to adjust
  3. In the Style panel, locate the Text settings
  4. Under Text settings, you can adjust the alignment using the text-align property
  5. If needed, you can also check other properties that might affect alignment such as display, justify-content, or flex settings

Remember that styles cascade bidirectionally in Webflow, so any changes you make at your largest breakpoint will affect smaller breakpoints unless overridden. Make sure to test your button’s appearance across all breakpoints after making these adjustments.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

3

This doesn’t help me solve the problem. But thanks for trying! ;)

4

Hey Mark can you show screenshots or vdeo of what you’re seeing?
It looks identical to me.

Webflow’s button element is just a link with a border and padding, so there are no child elements to flex align like you’re trying to do at 1920. If you’re changing padding anywhere, or possibly typography baseline settings, those are the few things that could affect relative text positioning.

5

I take that back- flex does seem to affect innerText.
Here’s how the find the styling conflicts that are messing with your layout.

1 Like
6

Watching you walk through this in real time was so helpful. I really appreciate you taking the time to make this clip. THANK YOU!

1 Like