css33 css animation 지원하지 않는 브라우저에서 보이게 하기 css animation은 익스플로러 10부터 적용된다. 애니메이션을 짰는데 opacity: 0으로 시작하는 경우 지원하지 않는 브라우저에서는 요소가 보이지 않게 된다. 미지원 브라우저에서 보이도록 하기 위해 요소에 opacity: 1 을 주고 키프레임 시작점에서 opacity: 0 을 준다. 키프레임이 먹히지 않더라도 요소가 보여진다. p { opacity: 1; animation-name: fadeIn; animation-iteration-count: 1; animation-fill-mode: forwards; animation-duration: 1s; } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } hyeonseok.com/blog/.. 2020. 9. 15. 끝에서 n개까지의 요소에 css 적용하기 .l4 .li {margin-bottom: 2%;} .l4 .li:nth-last-child(-n+4) {margin-bottom: 0;} 2020. 6. 18. position: absolute인 요소 가운데로 배치시키기 position: absolute; left: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); 2020. 6. 12. dataTables scrollY 에서 tfoot width 맞추기 .tfoot-bg .dataTables_scrollFoot .dataTables_scrollFootInner {padding: 0!important;} 2020. 6. 8. table overflow-x: auto 테이블 가로 스크롤 적용하기 .overflow-x-auto {overflow-x: auto;} .overflow-x-auto .table {width: auto!important; table-layout: fixed;white-space: nowrap} 2020. 5. 6. [bootstrap.css] col 내용 vertical-align middle 정렬하기 https://medium.com/wdstack/bootstrap-4-vertical-center-1211448a2eff Bootstrap 4 Vertical Center How to vertically align anything medium.com h-100 makes the row full height, and my-auto will vertically center the col-sm-12 column. Card 2020. 4. 20. mailform 메일폼에서 공백 / 여백 생기는 것 해결 style="display: block;padding:0;box-sizing:border-box;" a 와 img 태그에 추가해주면 된다. 2020. 4. 3. img 태그를 감싸는 a 태그 height가 더 클 때 https://stackoverflow.com/questions/6543452/why-is-the-height-of-a-divaimg-larger-than-the-size-of-the-wrapped-img img에 display:block; 추가하고 부모요소에 vertical-align 주면 된다. 2020. 4. 3. textarea resize 기능 없애기 textarea {resize: none;} 2020. 4. 3. 이전 1 2 3 4 다음