폰트 사이즈를 i에 줬더니 원안에 폰트가 위에 올라갑니다
568
작성한 질문수 2
안녕하세요 선생님
Sns 아이콘 애니메이션 강의를 듣다보니 궁금한게 생겨서 올립니다.
이 강의에서 a에 폰트사이즈랑 line-height를 주셨는데
제가 혼자 다시 해보는 과정에서 저는 i에 폰트 사이즈를 주고 a에
line-height를 줬는데 원안에 정가운데로 안가고 위에 올라가 있더라고요 왜 그런지 궁금합니다!
1.a에 line-height를 주고 i.fab에 폰트사이즈를 줬을때
2.a에 line-height와 폰트사이즈를 줬을때
답변 6
1
혹시나 해서 .fa에 폰트사이즈를 주었더니 같은 현상이 있네요.
아마도 .fa 자체가 inline-block이라서 폰트사이즈가 아래를 기준으로 커진것 같네요.
a에 폰트사이즈를 주시면되는 .fa 폰트사이즈를 준 경우 아래 처럼 vertical-align: middle을 주면 해소됩니다.
vertical-align: middle은 수직으로 중앙에 위치하라는 속성이니까 해보세요.
0
아래로 커진다고 했는데.. 아마 아래쪽으로 커진다는 말을 하려고 했을거에요.
아래 이미지를 보시면 div를 인라인 블록으로 바꾸면 인라인 블록 성질상 아래를 기준으로 높이가 달라집니다.
그리고 왜 아래쪽 기준으로 커지는지는 저도 모릅니다. 그냥 CSS에서 인라인블록의 성질이 그렇게 정해져 있습니다.
기본적으로 vertical-align: top으로 되어 있으니 vertical-align: middle 또는 bottom으로 상황에 맞게 사용하시면 됩니다.
참... 특별한 경우가 아니라면 폰트어썸은 영상 강의에 있는 4.7 버전을 사용하세요.
지금은 5.0 버전을 사용해서 연습하시는데 버전에 따라 영상 강의에 나온 결과와 다르게 보일 수도 있습니다.
0
답변 감사드립니다 선생님
fa 자체가 inline-block이라서 폰트사이즈가 아래를 기준으로 커진거 같다고 하셨는데
inline-block이 왜 아래를 기준으로 잡고 커지는지 알고싶습니다.
class 값 한 번에 부여하는법
2
80
1
@media에서의 flex-direction: column으로 세로배치 관련 질문드립니다.
1
69
1
div#css-checker-widget의 해결방
1
60
2
input의 포커스되었을때 검정선이 사라지지 않아요
0
79
2
강의듣는법
1
74
1
아코디언 만들기 100%이하의 화면으로 보았을때
1
68
2
input checked 질문합니다.
0
76
1
Bracket Pair Colorizer - 비주얼 스튜디오
1
140
2
Part 1 영상 안나옵니다
1
89
1
제이쿼리 작동이 안됩니다
1
199
3
강의 내용 질문있습니다.
1
120
2
일정 부분만 주석하는 방법
1
211
2
폰트어썸
1
134
2
인접선택자에 대한 질문드립니다!
1
129
2
delay 적용 안됨
1
134
1
rotateY(360deg)가 적용이 안됩니다!
1
186
2
세로이동할때 height값
1
138
2
폰트어썸이 안되요..
1
485
2
화면 정중앙에 오게끔 할수있나요?
1
169
1
어코디언 네비게이션 중
1
125
1
라이브서버 문제
1
226
2
넷플릭스 어코디언 예제 질문
1
104
1
이번 강의에선 display flex가 무조건 적으로 필요한건가요 ?
1
156
1
active 관련 질문
1
145
2