CSS (4) 썸네일형 리스트형 input의 placeholder text-indent 효과 주기 text-indent 대신 padding : 0 Xpx; 를 주면 된다. .search input { width: 180px; height:50px; border:1px solid #333; border-radius:30px; transition:all 0.2s; box-sizing:border-box; } .search input { width: 180px; height:50px; padding: 0 10px; border:1px solid #333; border-radius:30px; transition:all 0.2s; box-sizing:border-box; } CSS의 7가지 단위 2020년 4월 5일~4월 6일 주말 과제 https://webclub.tistory.com/356 :focus-within 으로 input 늘리기 HTML .search { width: 150px; margin-right: auto; position: relative; z-index: 1; } .search input { width: 150px; height:50px; border:1px solid #333; border-radius:30px; transition:all 0.8s; } .search:focus-within input { width: calc(100vw - 65px); } .question{ width:50px; height:50px; margin-left:20px; } .qna_view{ width:50px; height:50px; margin-left:20px; } -- BEFORE -- -- AFTER -- input 밖으로 마.. HTML CSS 절대경로와 상대경로 절대경로란? - 고유경로, 절대 변하지 않는 경로 - 예시 : icosoup.tistory.com 상대경로란? - 현재 페이지 기중에서 사용하는 경로 ' / ' 최상의 디렉토리 의미 ' ./ ' 파일의 현재 디렉토리 의미 ' ../ ' 상위 디렉토리 의미 추가 : 두 단계 상위 디렉토리로 이동 : '../ ../' 이전 1 다음