>source

주로 두 가지 클래스의 버튼, 기본 및 경고가있는 각형 앱에서 일하고 있습니다. 기본적으로 기본 스타일 시트에 적용된 동일한 스타일이 있습니다. 그러나 기본 버튼 (아래 스크린 샷의 오른쪽에있는)은 1.5px 키가 크고 작은 차이가 있지만 버튼을 약간 꺼냅니다. 나는 둘 다 같은 높이를 가질 수 있도록 강제하려고 노력했지만 그것은 작동하지 않습니다. 이게 뭐야?

스타일 및 템플릿 :

button:disabled {
    color: var(--text-disabled) !important;
    background-color: var(--basic-button-bg) !important;
    box-shadow: 0 4px 8px 0 rgb(0 0 0 /20%) !important;
    cursor: default;
    border: 0 !important;
}
.primary:not([disabled]) {
    background-color: var(--basic-button-bg) !important;
    box-shadow: 0 4px 8px 0 rgb(0 0 0 /20%) !important;
    outline: 0;
    color: var(--basic-button-color) !important;
    border: 0 !important;
}
.warn:not([disabled]) {
    background-color: var(--warn-button-bg) !important;
    color: var(--warn-button-color) !important;
    outline: 0;
    border: 0 !important;
}

<button
    i18n
    i18n-aria-label
    mat-raised-button
    border-right
    type="warn"
    class="warn"
    aria-label="close"
    (click)="cancelCreateReport()"
>    Cancel
</button><button
    mat-raised-button
    type="primary"
    class="primary"
    (click)="createAndOpenReport()"
>    <b i18n>Create</b></button>

나는하지 않았지만 지금 그것을 시도했다. 제안에 감사드립니다. 그러나 불행히도 도움이되지 않았습니다.

mntblnk2021-09-17 09:27:11

상자 크기 조정 : Border-Box를 시도 했습니까?

theberzi2021-09-17 09:27:11

code 스 니펫은 두 개의 버튼 사이의 높이는 차이가 표시되지 않습니다. code에서 필수적이지 않은 모든 것을 일시적으로 제거하려고 시도해야합니다 (비트 단위로 비트를 수행하므로 특정 원인의 경우 문제가 발생하면) 버튼이나 해당 스 니펫 주변. 브라우저의 devtools (측면 탭 : 레이아웃)를 사용하여 버튼의 높이를 확인하고 추가 기능이 어디에서 오는 위치를 확인하십시오.

theberzi2021-09-17 09:27:11

국경을 그대로 남기십시오 (즉, 0 사이즈를 적용하지 마십시오). 그러나 테두리 색상을 설정합니다 : 투명

Andrei2021-09-17 09:27:11
  • 이전 java : 나는 테이블을 채우기 위해 내 SQL 데이터베이스에서 값을 전달하려고하지만 데이터를 되돌릴 수 없습니다.
  • 다음 c : 원자 원형 버퍼 정확도 (인터 로킹 덱스 교환)