Remove the underscore that appears when I hover over an image linked to a website-CodePudding

I have the following snippet of code:

shinyUI(fluidPage(
  useShinyjs(),
  # some code
  shinyjs::hidden(div(
    navbarPage(title = div(
      a(href="https://en.wikipedia.org/wiki/Main_Page", target = "_blank", img(src="img_1.png", filetype="image/png", height="30px", width="90px", style="position: relative; margin: -15px 5px; display: right-align;")),
      a(href="https://fr.quora.com/", target = "_blank", img(src="img_2.png", filetype="image/png", height="30px", width="60px", style="position: relative; margin: -15px 15px; display: right-align;")),
      "Indicators"
      ),
      # some code
    )
  ))
))

When I hover over img_1.png, an underscore appears to the right of img_1.png itself. The same thing happens with img_2.png. How do I remove the underscore that appears to the right of the images? Is there a general solution? I know there is something like text-decoration: none; in CSS, but how does it integrate with Shiny? Thanks in advance.

CodePudding user response：

You can change the display property of the anchor tag from the default inline to inline-block.

a(href = "https://en.wikipedia.org/wiki/Main_Page", 
  style = "display:inline-block", 
  img(src="img_2.png"))