이 작은 코드에는 텍스트 (레이블)와 텍스트 입력이 포함되어 있습니다.
내가 찾고있는 것은 텍스트 + 입력이 div의 100 %를 차지하도록하는 것입니다 (예 : 텍스트의 경우 20 %, 입력의 경우 80 %) 텍스트는 영역의 중앙에 있어야하며 배경은 입력과 높이가 같습니다. .
나는 background-color: blue;
div에 적용하면서 span으로 시도했지만 아무런 영향을 미치지 않았습니다.
당신은 그것을 할 호를 알고 있습니까?
미리 감사드립니다.
#zoneFiltre {
width: 100%;
}
.champs {
width:20%;
background-color: blue;
text-align: middle;
color: white;
}
#filtreMultiAptitudes{
width:80%;
float:right;
}
<div id="listeMultiAptitude">
<div class="zoneFiltre">
<label class="champs">filter: </label>
<input type="text" id="filtreMultiAptitudes" />
</div>
</div>
사용하고자하는 경우, Flexbox
당신은 사용할 수 있습니다 flex: 0 0 80%
에 input
와 flex: 1
에 label
또한text-align: center
.zoneFiltre {
display: flex;
}
.champs {
flex: 1;
background-color: blue;
text-align: center;
color: white;
}
#filtreMultiAptitudes {
flex: 0 0 80%;
}
<div id="listeMultiAptitude">
<div class="zoneFiltre">
<label class="champs">filter: </label>
<input type="text" id="filtreMultiAptitudes" />
</div>
</div>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다