Standardize size of CTA buttons

Hi All,

In reviewing my experience, I noticed that the size of the CTAs change depending on the length of the description in the Details section of the results card. For example, as you can see in the image below, the CTA label is the same for both entities, ‘Learn More’, however the size of the button varies depending on the length of the description.

Similarly, as you can see in the image below there are 3 different sized CTAs in the Product result cards. I’d like to establish some consistency in terms of the size of the CTAs across a given entity type. Does anyone have a recommendation in terms of how to do so?

Thank you,
Austin

Hi Austin,

I think the best thing you can do here is set a standard width for your CTAs. You can do this by setting the width of the text of the button, since that’s what’s controlling the overall button width.

Try adding the below and see if it helps!

.HitchhikerCTA-iconLabel {
  width: 200px;
}

The CTAs should look like the below aftewards:

2 Likes