Home / Questions / 563547
Accepted
Matias Perez
Asked: 2022-10-22 06:48:33 +0800 CST 2022-10-22 06:48:33 +0800 CST

Logo with link to index also takes the margin of the logo

  • 772

Hello, I am trying to use a logo with redirection to the index, it works, I have the logo centered with 0 auto, but the left and right margins are also taken as part of the link, my question, how to make the link only affect the area from image?

attached code:

.nombre-sitio img{
    margin: 0 auto;
    text-align: center;
}
<header>
        <h1 class="nombre-sitio"><a href="index.html"><img src="img/logo.png" alt="logo"></a></h1> 
</header>
enter image description here

html

1 Answers

  1. Best Answer

    the code you have written is correct, but if you look at the part of the browser you have put the link before the h1therefore the link is affecting your entire h1.

    To solve it, the only thing you have to do is change the structure as the code that you have put before

    <header>
  <h1 class="nombre-sitio">
    <a href="index.html">
      <img src="img/logo.png" alt="logo">
    </a>
  </h1> 
</header>

    With this your problem should be solved.

    • 2