Have a Button and a Link have the same size

How would i go about getting them the same size? The left one is a link and the right one a button.

6 Replies

It depends, Are you using classes for each of them? What's inside each if them? Do they share the same parent container? A codepen would be great.. But in general if you want two things to share the same value just use a comma. Like this:

a, button {
    width: < the value you want >;
}

a, button {
    width: < the value you want >;
}

13eck•3y ago

If it's a flex container you can set flex-basis: 0; so they both start at no width and then get an equal width distribution.

~MARSMAN~•3y ago

I thought he was talking about font size🤦‍♂️.. i hate it when my mind glitch 😑

RedCommander•2y ago

https://codepen.io/redcommander735/pen/Poevgdy

RedCommander735

CodePen

...

13eck•2y ago

If you add this to your CSS file it should solve your issues.

.create_account,
.submit {
  flex-basis: 0;
}

.create_account,
.submit {
  flex-basis: 0;
}

The problem you're having is that flexbox distributes remaining available space. That is, all flex children take up their normal amount of space and then get more based on flex-grow. The flex-basis property tells flexbox what the "normal amount of space" is. For this case, you set the two elements to "default 0 space" so flexbox can make the two elements even

RedCommander•2y ago

Thank you

Gaming

Programming

Have a Button and a Link have the same size