본문 바로가기

CSS

CSS: 빈칸이 아닐 때만 width 갖도록 하기

728x90
반응형

<span> 태그는, 태그 안이 빈값인 경우 요소 검사에는 잡히지만 공간 차지는 안함

span에 width를 주기 위해서는 inline-block 의 css style 사용

하지만 이 경우 태그 내에 아무것도 없어도 공간을 차지한다.

 

span에 width 등의 속성을 주고 싶은데, 내부가 비었을 때는 공간 차지를 하지 않도록 하고 싶다.

 

다음과 같이 태그 내부가 비어있지 않을때만 inline-block과 width를 갖도록 css 를 설정하면 된다.

.inblock:not(:empty) {
    display: inline-block;
    width: 100px;
}

 

728x90
반응형

'CSS' 카테고리의 다른 글

image 꽉 채우기 # 이미지간 딱 붙도록 경계 제거  (0) 2023.09.04
CSS: HTML tag 줄바꿈  (0) 2023.02.28