Develop/HTML&CSS (2) 썸네일형 리스트형 [Develop/HTML&CSS] CSS box-sizing 알아보기 box-sizing에 대하여 알아보기 CSS에서 box-sizing이란 무엇이고 언제 사용하게 될까? MDN에서는 box-sizing 속성을 아래와 같이 정의하고 있다. box-sizingCSS속성은 요소의 너비와 높이를 계산하는 방법을 지정합니다.라고 되어있다. CSS 박스 모델은 요소에 테두리나 안쪽 여백이 있으면 너비와 높이에 그 크기만 큼 더하여 화면에 그리게 된다. 따라서 내가 같은 크기의 div 영역을 만들고 padding이나 border를 서로 다르게 준다면 같은 크기의 div일지라도 그 크기가 달라지게 되는것이다. box-sizing에는 2가지 키워드가 있다. content-box와 border-box 맨 처음에 이 속성을 알게 된 것도 저 border-box 키워드 덕분이다. conten.. [Develop/HTML&CSS] Mobile input focus 시 zoom 막기 및 mobile meta tag 정보 Mobile input 클릭 시 focus 막기 및 mobile meta tag 정보 친구들과 방 코드를 통한 채팅을 구현하는 팀 프로젝트 중 모바일에서 input창 focus시 화면이 zoom이 되는 현상이 발견하여 수정 중 블로그에 정리하고 누군가 이런 이슈에 대하여 수정하기 쉽도록 블로그를 정리하기로 했다. 예를 들어 Mobile로 web project시 input을 클릭하여 글을 쓰려고 하는데 화면이 zoom 처리되어 의도하지 않은 스크롤이 생기거나 화면이 가려질 경우 아래와 같은 방법으로 처리할 수 있다. 첫 번째, 가장 쉬운 방법은 input이나 textarea에 font-size를 16px 이상으로 주면 된다. 모바일 환경에서 글자 크기가 16px이하 일 경우엔 고맙게도 자동으로 zoom 처.. 이전 1 다음
