skright

텍스트 스타일링 - 중앙정렬에서 text-align이 아니라 flex를 쓴다면?

skright — Wed, 14 Jan 2026 15:56:11 +0900

물로 text-align을 쓰면 되지만,

중앙정렬을 시키고자 할 때, flex와 justify-content를 쓴다면 어떻게 되는지 생각해보자.

flex의 경우에는 부모에 적용을 해서, 자식에게 정렬 기준을 세우면 되는데,

      <div className={styles.sidebarTitle}>주변 화장실 목록</div>

아래와 같은 상황에서는, textt가 sidebarTitle의 자식요소 관계라, 그냥 flex와 justify-content를 같이 쓰면 된다.

skright — Wed, 14 Jan 2026 13:35:16 +0900

export default의 경우에는 { }이 필요없지만,

일반 export의 경우에는 { }로 콕 집어서 import해줘야한다.

skright — Wed, 14 Jan 2026 13:26:10 +0900


 font-family: inherit;

를 추가해주면 된다.

skright — Wed, 14 Jan 2026 13:18:57 +0900

.header * {
    font-family: 'Alfa Slab One', cursive;
}

를 쓰면 된다.

skright — Wed, 14 Jan 2026 13:16:19 +0900

일반 태그(div, p, span 등)
- 부모(body)가 "Arial 써!" 하면 상속받습니다.
- font-family 기본값: inherit (부모 꺼 따름)
폼 태그(button, input 등)
- 폼 태그도 font-family를 상속받지만,
- 브라우저의 기본 UA 스타일이 font-family를 직접 지정하여 상속된 값이 덮어씌워져보이는 경우가 많다.

skright — Wed, 11 Jun 2025 22:19:38 +0900

팝업창과 같이 무언가를 클릭해서 열리는 창은 대부분 window.open을 통해서 열렸을 것이다.

이럴 때는 back을 하기가 좀 까다로울 수가 있는데,

그럴 때는 아래 코드와 같이 자바스크립트를 통해서 열린 창만 꺼주면 된다.

        if (window.opener && !window.opener.closed) {
          window.close();
        } else {
          history.back();
        }