반응형

Alignment 8

CSS를 사용하는 모든 브라우저의 "div" 요소를 수직으로 중앙에 맞추려면 어떻게 해야 합니까?

질문자 :Burak Erdem CSS를 사용 div 를 가운데에 맞추고 싶습니다. 나는 테이블이나 JavaScript를 원하지 않고 순수한 CSS만 원합니다. 몇 가지 솔루션을 찾았지만 모두 Internet Explorer 6 지원이 누락되었습니다. Div to be aligned vertically Internet Explorer 6을 포함한 모든 주요 브라우저에서 div 세로로 가운데에 맞추려면 어떻게 해야 합니까? 다음은 고정 너비의 유연한 높이 콘텐츠 상자를 수직 및 수평 중앙에 구축할 수 있는 최고의 만능 솔루션입니다. 최신 버전의 Firefox, Opera, Chrome 및 Safari에서 테스트 및 작동했습니다. .outer { display: table; position: absolute;..

etc./StackOverFlow 2022.02.27

브라우저 간에 일관되게 확인란과 레이블을 정렬하는 방법

질문자 :Community Wiki 이것은 나를 끊임없이 괴롭히는 사소한 CSS 문제 중 하나입니다. 스택 오버플로 주변 사람들은 어떻게 checkboxes 과 labels 브라우저 간에 일관되게 수직으로 정렬합니까? Safari에서 올바르게 정렬할 때마다(보통 vertical-align: baseline on the input ), Firefox와 IE에서는 완전히 꺼져 있습니다. Firefox에서 수정하면 Safari와 IE가 불가피하게 엉망이 됩니다. 나는 양식을 코딩할 때마다 이것에 시간을 낭비합니다. 다음은 내가 작업하는 표준 코드입니다. Label text 나는 일반적으로 Eric Meyer의 재설정을 사용하므로 양식 요소는 재정의가 상대적으로 깨끗합니다. 당신이 제공해야 할 어떤 팁이나 트릭..

etc./StackOverFlow 2021.12.29

브라우저 간에 일관되게 확인란과 레이블을 정렬하는 방법

질문자 :Community Wiki 이것은 나를 끊임없이 괴롭히는 사소한 CSS 문제 중 하나입니다. 스택 오버플로 주변 사람들은 어떻게 checkboxes 과 labels 브라우저 간에 일관되게 수직으로 정렬합니까? Safari에서 올바르게 정렬할 때마다(보통 vertical-align: baseline on the input ), Firefox와 IE에서는 완전히 꺼져 있습니다. Firefox에서 수정하면 Safari와 IE가 불가피하게 엉망이 됩니다. 나는 양식을 코딩할 때마다 이것에 시간을 낭비합니다. 다음은 내가 작업하는 표준 코드입니다. Label text 나는 일반적으로 Eric Meyer의 재설정을 사용하므로 양식 요소는 재정의가 상대적으로 깨끗합니다. 당신이 제공해야 할 어떤 팁이나 트릭..

etc./StackOverFlow 2021.12.28

이미지 옆에 텍스트를 세로로 정렬하시겠습니까?

질문자 :sam 왜 vertical-align: middle 작동하지 않습니까? 그러나 vertical-align: top 이 작동합니다. span{ vertical-align: middle; } Doesn't work. 실제로 이 경우에는 매우 간단합니다. 이미지에 수직 정렬을 적용합니다. 모두 한 줄에 있으므로 텍스트가 아니라 정렬하려는 이미지입니다. Works. FF3에서 테스트되었습니다. 이제 이러한 유형의 레이아웃에 flexbox를 사용할 수 있습니다. .box { display: flex; align-items:center; } Works. Michael Haren 다음은 수직 정렬을 위한 몇 가지 간단한 기술입니다. 한 줄 세로 정렬:가운데 이것은 쉽습니다. 텍스트 요소의 줄 높이를 ..

etc./StackOverFlow 2021.12.03

CSS에서 셀 패딩 및 셀 간격을 설정하시겠습니까?

질문자 :kokos HTML 테이블에서 cellpadding 및 cellspacing 은 다음과 같이 설정할 수 있습니다. CSS를 사용하여 어떻게 동일한 작업을 수행할 수 있습니까? 기초 CSS에서 "cellpadding"을 제어하기 위해 단순히 테이블 셀에 padding 예: "cellpadding"의 10px: td { padding: 10px; } "cellspacing"의 경우 border-spacing CSS 속성을 테이블에 적용할 수 있습니다. 예: "cellspacing"의 10px: table { border-spacing: 10px; border-collapse: separate; } 이 속성은 구식 "cellspacing"으로는 할 수 없었던 별도의 수평 및 수직 간격을 허용합니다. ..

etc./StackOverFlow 2021.10.05

요소를 가로로 가운데에 맞추는 방법

질문자 :Community Wiki CSS를 사용하여 다른 수평으로 중앙에 맞추려면 어떻게 해야 합니까? Foo foo 이 CSS를 내부 적용할 수 있습니다. #inner { width: 50%; margin: 0 auto; } width 를 50% 로 설정할 필요는 없습니다. 보다 작은 너비가 작동합니다. margin: 0 auto 는 실제 센터링을 수행하는 것입니다. Internet Explorer 8 (이상)을 대상으로 하는 경우 대신 다음을 사용하는 것이 좋습니다. #inner { display: table; margin: 0 auto; } 내부 요소를 가로로 가운데로 만들고 특정 width 를 설정하지 않고 작동합니다. 여기에서 작동하는 예: #inner { display: table; marg..

etc./StackOverFlow 2021.09.30
반응형