CSS4 [CSS] [TailWind] spinner가 너무 빨리 회전함 spinner가 너무 빨리 회전함 에러내용 tailwind의 animate-spin 속성을 이용하여 AI의 처리를 기다리는 동안 Spinner를 표시되게 하려함 처음에는 회전하지 않아 왜 그런가 했는데 다양한 디자인을 spin처리 해보니 회전하지 않는게 아니라 너무 빨리 회전하여 멈춘 것처럼 보인 거였음. 해결내용 tailwind 제대로 적용이 안 될 때 (일부만 적용) 지난번 tailwind가 제대로 적용이 안 될 때 CDN을 사용해서 tailwind를 설치하였음 이에 따라 이 에러도 해결됨 내가 생각한 이유 이러한 link가 head부분에 추가 되어있었다. 이 링크를 살펴보면 tailwind CSS 라이브러리 v2를 사용하는 것을 알 수 있었다. 현재 tailwind는 v3이며 버전 차이에 따라 에러.. 2023. 9. 7. [CSS] [TailWind] TailWind 설치를 제대로 했는데 일부 적용이 안 될 때 TailWind 제대로 적용이 안 될 때 (일부만 적용) 에러내용 tailwind를 적용하려 하는데 일부 속성이 적용이 되지 않을때 ex) 테일윈드 다음과 같이 작성했을때 text 색상은 여전히 black값으로 text-color만 적용이 되지 않았음 해결방법 html에 CDN을 이용하여 스크립트 태크를 이용해서 Tailwind를 사용하였다. 내가 생각한 이유??(IDK) 분명 공식문서에 설명된 순서로 CLI를 이용해서 설치했는데 설치 과정에서 올바르게 설치되지 않았던 부분이 있던 것 같다. (확실X) 2023. 9. 7. [CSS] [TailWind] header를 고정하고 싶은데 일부 main컨텐츠에 가려짐 header를 고정하고 싶은데 일부 main컨텐츠에 가려짐 에러내용 header 부분을 스크롤하면 따라오게 구현했는데 일부 컨텐츠에 가려짐 해결방법 header에 z-index속성을 줘서 앞에 오게함 수정후 내가 생각한 에러 이유 header의 fixed 속성과 겹쳤던 요소의 relative 속성 때문에 겹쳤던 것 같음 z-index 속성을 통해 우선순위?를 설정하자 2023. 9. 7. [CSS] CSS flex flex flex란? 요소들을 행과 열 형태로 배치하는 일차원 레이아웃 방법 기존 float, position 방법으로 레이아웃을 표현하는 것은 상당히 복잡함 요소지정 정렬하고자 하는 요소들은 다음과 같이 지정한다 .flex { display: flex; } flex-direction (열 또는 행) flex-direction: row; flex-direction: row-reverse; flex-direction: column; flex-direction: column-reverse; flex-wrap (줄 바꿈 설정) 요소들을 강제로 한준에 배치할 것 인지 여러행으로 나누어 표현할 것 인지 정함 /* 기본 값으로 부모 요소 영억을 벗어나도 한줄에 배치함 */ flex-wrap: nowrap; /* 요.. 2023. 8. 21. 이전 1 다음 728x90
