Search code examples
reactjsreact-reduxreact-hookscustom-error-handling

Why we get error when we add any tag in between <img/> tag in ReactJS?

I have added span tag in between the img tag so its giving an error Please Explain Why it is giving an error. What the exactly problem is...

<img src="any demo images here" alt="Nadeem">
                <span>adeem</span>
</img>
Solution

  • The reason is because the img tag can not have any child elements.

    To get the result you are looking for you may want to wrap both the img and span in a wrapper div like this.

    <div style={{position: "relative"}} />
    <img src="any demo images here" alt="Nadeem">   
    <span style={{position:"absolute", bottom: "0px", margin: "0px auth"}}>adeem</span> 
</div>

    (I am not sure if this is what you are looking for but assuming so from your question)