나가려고 결정하기 위한 최선의 방법을 2 요소가 동일한 크기의 텍스트를 기반으로 더 큰 요소입니다.
기본적으로 취 2 텍스트 항목은"ouverture de 세션"및"xyz"(사용을 위한 짧은 단어를 들어)도록 버튼 크기가 동일 및 충분히 큰 처리 더 큰 2 개의 텍스트 입력이 있습니다.
이 할 수 있는 자바 스크립트를 통해,각도,어떤 것이다.
당신은 그것을 할 수 있습 CSS 로 그리드:
.button-panel {
display: inline-grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
column-gap: 10px;
}<div class="button-panel">
<button>A very long button name</button>
<button>Ok</button>
</div>당신이 얻을 수 있는 버튼으로 크 offsetWidth을 적용하는 것 기타 단추의 width 스타일을 제공합니다.
const buttons = document.querySelectorAll('button')
if (buttons[1].offsetWidth > buttons[0].offsetWidth) {
buttons[0].style.width = buttons[1].offsetWidth + 'px';
} else {
buttons[1].style.width = buttons[0].offsetWidth + 'px';
}<button>Hello World!</button>
<button>Spectric</button>이 있는 경우 ultiple 버튼 더욱 확장 가능한 솔루션:
const buttons = document.querySelectorAll('button')
const biggestWidth = [...buttons].reduce((a,b) => a = b.offsetWidth > a ? b.offsetWidth + 1 : a, 0)
buttons.forEach(e => e.style.width = biggestWidth + 'px')<button>Hello World!</button>
<button>Spectric</button>속성을 설정할 수 있습의 최소 너비를 버튼 요소입니다. 이렇게 함으로써 작은 버튼을 것 같은 폭으로 더 큰 하나입니다.