Solution 1 :

I would suggest you to use inline element instead of p like below –

<span id='hello'>Hello</span>

Because p is block element and no matter where your contents gets over in the line it will takes the space of whole line.

For more in details refer this link

Solution 2 :

I write an example, I think this helps you
you can see the link

  <buttom onclick="clickMe()">click me please</buttom>
    <p id="write"></p>

     function clickMe() {
        let getELementP = document.getElementById("write");
        getELementP.innerHTML = "writeHere";

Problem :

So what I’m trying to make is a paragraph in HTML and then when you click on it it would do a certain action, for example:

<p id='hello'>Hello</p>

hello.onclick = function() {

the only problem is that when I click next to the text, it still detects it as a click, I want the click ratio to be the length of the paragraph’s text. What’s the best way I could do this?


Comment posted by Pardeep Jain

If it solved your issue, mark it as accepted to close this question and upvote if you want.