CSS

[css] CSS - 인풋태그 높이통일 (= 동일높이 = 높이동일 = 높이같게 = 세로길이 똑같게 = 높이맞추기) INPUT TYPE TEXT SUBMIT HEIGHT EQAUL EQUAL

 

 

<style>

.input,

.submit {

    display: inline-block;

    padding: 10px 15px;

    font-size: 20px;

    border-radius: 0;

    -webkit-appearance: none;

}


.input {

    border: 1px solid lightgray;

}


.submit {

    background-color: lightgreen;

    border: 1px solid transparent;

}

.submit::-moz-focus-inner { 

    border: 0;

}

</style>

<form>

    <input class="input" type="search" placeholder="Search for...">

    <input class="submit" type="submit" value="Submit">

</form>

 

https://codepen.io/sinbi/pen/ZEYRqMw?editors=1100

※ 위 코드는 영문일 때만 적용.


분류 제목
selector CSS - :valid 가상선택자 - 유효요소 (= 유효값 갖는 요소 선택, IE10)
selector CSS - ::selection 가상선택자 - 사용자가 선택한 영역 (= ::selection선택자) (가상…
selector CSS - .class 클래스선택자 ★
selector CSS - .class1.class2 클래스선택자 ★★★ - 두 클래스가 (모두/함게/둘다/동시) 정의된 요…
selector CSS - .class1 .class2 클래스선택자 ★★ - class1자손 중 class2 갖는 모든 요소
flex CSS - flex 속성(I) ☆ - flex-grow, flex-shrink, flex-basis 속성 일…
flex CSS - flex-basis 속성(I) ★ - 아이템 초기 길이 (= 아이템너비 = flex-basis속성…
flex CSS - flex-grow 속성(I) ★ - 아이템 너비 증가 (= flex-grow속성 = 플렉스그로속성…
flex CSS - flex-shrink 속성(I) ★ - 동일컨테이너 안 나머지 플렉스아이템에 비해 얼마나 줄어들지…
css CSS - FADE-IN TEXT - 페이드인 텍스트 (= 서서히 사라지는 이미지 + 서서히 나타나는 글자)
text CSS - text-decoration-line 속성 - 텍스트라인위치종류 (= text-decoration…
text CSS - text-decoration-style 속성 - 텍스트라인모양 (굵은선, 파선, 점선, 물결선 등…
text CSS - text-decoration-color 속성 - 텍스트라인색깔 (= 텍스트데커레이션컬러속성, IE…
css CSS - 반응형 마름모 갤러리 (Responsible Rhomb gallery on grids + clip…
css CSS - 스크롤 따라다니는 양사이드배너 (= 양쪽날개배너 = 사이드고정배너) 3단 레이아웃
19/33
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티 2
웹유틸
회원센터
홈짱닷컴 PC버전 로그인