I want an <a> to be the same size as a text of a <span>-CodePudding

I wanted to adjust an "a" tag in a "span" text so that when I touch the text it takes me to the web page, but I get what comes out in the image:

the "a" tag is too long

Does anyone know how to make the "a" tag the same size as the text?

but the "a" tag has to adapt to any text, it has to be dynamic

CodePudding user response：

you want to make a link, when you click on it to lead you a new page? use this < a href="url"> click here

CodePudding user response：

Please check following.

span, span a{color:#000; text-decoration:none; font-size:20px;}

<span><a href="#">page</a></span>

CodePudding user response：

<body>
<div>
< a href="url"> click here </a>
border=1px solid black;
width=757px;
height=24px;
</div>
</body>

CodePudding user response：

a{ 
  background: pink;
  }

span{
    background-color: lightblue;
    padding: .5rem;
    max-width: fit-content;
  }

<span>
  <a href="#">Link</a>
</span>