<nav>
<a href="/" class="logo">
<img src="/images/Img_logo.png" alt="logo image" class="logo_img"/>
</a>
<div class="login_button">
<a href="signin.html" target="_blank">
로그인
</a>
</div>
</nav>
.logo와 .logo_img 사이에 작은 공백이 생겼다.
단순하게 아래와 같이 a 태그를 공백없이 모두 붙여주면 해결 되지만 가독성이 좋지 않아서 잘 사용하지 않는다.
<a href="/" class="logo"><img src="/images/Img_logo.png" alt="logo image" class="logo_img"/></a>
따라서 공백을 제거하려면 .logo에 font-size: 0;을 적용하면 된다.
.logo {
font-size: 0;
}
'Language > CSS' 카테고리의 다른 글
[CSS] 스크롤바 숨기기 (0) | 2024.06.06 |
---|---|
[CSS] initial 속성과 inherit 속성 (0) | 2024.04.02 |
[CSS] flex 속성 정리 (flex-basis, flex-grow, flex-shrink) (0) | 2024.03.12 |
[CSS] active와 focus의 차이 (0) | 2023.10.20 |
[CSS] overflow (0) | 2023.07.27 |