I need help setting this up

I want to turn this into a link.

Maybe if you can do the first 2 colors I can maybe figure out the rest.

53.2% per color


<a href="" target="_blank" style="display:block; width: 266px; height: 50px;background-image: linear-gradient( to right, #ff0092 100px, #ffca1b 100px,#ffca1b 200px, #b6ff00 200px, #b6ff00 300px, #228dff 300px, #228dff 400px, #ba01ff 300px, #ba01ff 300px );"></a>

Hello,

I don’t understand, you will 53% for each color ?

I don’t speak french, sorry.

i tanslate :slight_smile:

Yes
Yes

That is a link. The <a> tag with an “href” value is the way to create a link.

If you’re asking about styling, then please explain more clearly what you are trying to achieve.

1 Like

What I want to do.

I changed div to href.

Should I be separating the colors into percentages, and not px for this?

<a href=""... IS a link as @TechnoBear has already said. All you need to do is put the URL between the two quote marks…

I’m trying to divide the colors up. 53.2% per color.

53.2% of what?

Each color will fill up that space. of 266 is the width.

5 colors

In a linear gradient, you can use either unit, whichever best suits your needs.
You may find px works with a fixed size element and % is better for responsive elements which change size.

But, if I’m doing 53.2% of each color, wouldn’t I have to use percent?

Not really. If the width of each color is 53.2% of the total width of the page, then you only have room for one color anyway.

266/5 = 53.2.

266px is not 100% (or maybe it is?)

100% / 5 = 20%

266px / 5 = 53.2px

2 Likes

I’m still confused on how I would set this up.

<a href="" target="_blank" style="display:block; width: 266px; height: 50px;background-image: linear-gradient( to right, #ff0092 100px, #ffca1b 100px,#ffca1b 20px, #b6ff00 20px, #b6ff00 30px, #228dff 30px, #228dff 40px, #ba01ff 30px, #ba01ff 30px );"></a>

“Set it up” in what way? As ever, if you explained your intentions - what you want/expect this to do, it would be easier to provide meaningful assistance.

2 Likes