다른 브라우저의 줄 높이와 글꼴 크기?
Gaston Flanchard
div에서 숫자를 세로로 정렬하려고합니다. 코드는 다음과 같습니다.
<div class="nb">2</div>
display: inline-block;
height: 56px;
width: 56px;
background: transparent url("../img/stepnb.png") center center no-repeat;
line-height: 56px;
color: #255066;
text-shadow: 1px 1px 3px rgba(255,255,255,.75), -1px -1px 2px rgba(0,0,0,0.75);
font-size: 42px;
font-weight: bold;
margin-top: -25px;
참고 : 결과는 IE9에서 11까지 동일합니다.
보시다시피 다른 브라우저에서 세로로 중앙에 있지 않습니다. 조건부 주석이나 CSS 해킹없이 모든 주요 브라우저에서 어떻게 정렬 할 수 있는지 알고 계십니까?
편집 : 문제는 CSS 재설정 사용으로 인해 발생할 수 있습니다. 확인하겠습니다.
edit 2 : 정렬 문제는 상위 div에 할당 된 "Myriad pro"글꼴에서 발생했습니다.
Gaston Flanchard
정렬 문제는 상위 div에 할당 된 "Myriad pro"글꼴에서 발생했습니다.
도움을 주셔서 감사합니다 :)
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
에서 수정
관련 기사
Related 관련 기사
- 1
브라우저 내의 글꼴 크기에서 줄 높이를 어떻게 얻을 수 있습니까?
- 2
텍스트 줄의 정확한 높이 (글꼴 크기 + 줄 높이)
- 3
동일한 글꼴 패밀리에 대해 다른 브라우저에서 다른 글꼴 크기
- 4
밑줄 텍스트-글꼴 크기가 다른 교차 범위의 선 두께
- 5
서로 다른 크기의 아이콘 정렬 (멋진 글꼴)
- 6
Graphviz (DOT), 동일한 레이블의 다른 글꼴 크기
- 7
uiTextView에서 글꼴 크기 줄이기.
- 8
Android Studio : 글꼴 크기 줄이기
- 9
글꼴 크기를 줄이는 방법
- 10
JS 북마크릿 : 사이트의 글꼴 크기 늘리기 / 줄이기
- 11
웹 페이지는 크기가 커진 글꼴을 표시하는 Android 브라우저를 제외한 모든 브라우저에서 잘 작동합니다.
- 12
글꼴 크기 190 %와 200 %의 차이
- 13
Bootstrap 3 Framework의 글꼴 크기 버튼 늘리기 및 줄이기
- 14
CSS 줄 높이 브라우저 텍스트 크기 조정
- 15
Outlook 2016의 메시지 목록에서 글꼴 크기 줄이기
- 16
Unsemantic을 사용하여 두 개의 서로 다른 글꼴 크기를 한 줄에 배치하는 방법
- 17
모바일 브라우저의 HTML 글꼴 크기 문제
- 18
Google 크롬 브라우저에서 jquery를 사용하여 iframe 태그 내에서 선택 / 강조 표시된 텍스트의 글꼴 크기를 늘리거나 줄입니다.
- 19
Excel의 하이퍼 링크 글꼴은 항상 기본 글꼴 / 크기로 변경됩니다.
- 20
Excel의 하이퍼 링크 글꼴은 항상 기본 글꼴 / 크기로 변경됩니다.
- 21
단어 사이의 공백에서 줄 바꿈 후 글꼴 크기 변경
- 22
줄 수 및 글꼴 크기에 따라 RichTextBox 크기 조정
- 23
Rmarkdown (ioslides)의 kable 테이블에서 열 머리글 이름 글꼴 크기 줄이기
- 24
특정 글꼴 하나의 경우 다른 앱에서 동일한 글꼴 크기가 다르게 보이는 이유는 무엇입니까?
- 25
파이썬 플롯의 다양한 글꼴 크기
- 26
줄 높이 / 글꼴 크기는 가변 Visual Studio 2015 업데이트 3
- 27
iTerm2에서 글꼴 크기 늘리기 / 줄이기
- 28
밑줄과 글꼴의 색상이 다릅니다.
- 29
ggplot에서 텍스트 레이블의 다른 부분에 대한 다른 글꼴 크기
몇 마디 만하겠습니다