웹공부/css

아이콘이 있는 버튼만들기 - 2

바구레 2021. 1. 24. 18:41

https://kure0406.tistory.com/26

 

아이콘이 있는 버튼만들기

아이콘이 있는 버튼을 만드는 경우가 많다 하지만 만들때마다 아이콘을 이미지태그로 넣는 경우도 있고 버튼의 배경처리를 한다음 text-indent를 이용하기도 하는데 만들다보니 규칙도 없고 버튼

kure0406.tistory.com

과거에 작성한 글을 보다가 이불킥을 할만한 글을 발견했다. 취업하고 3개월때 작성한 글이었는데, 버튼 아이콘 정렬을 이렇게 고민했나 싶다. 

지금 작업하라고 하면 이렇게 하지 않았을까....

이전 글을 다시 읽어보니 당시에는 버튼 텍스트가 2줄로 떨어지더라도 아이콘이 가운데 정렬이 되어야 했던 것 같다. 생각해보면 버튼 텍스트가 2줄이 되면 디자이너님이 의도한 버튼 모양이 깨지는 것인데, 아이콘을 가운데로 정렬할 것이 아니라 텍스트가 떨어지지 않게 했어야 하는게 아닌가 싶다. 당시엔 디자이너님이 아이콘을 가운데로 하라고 했으니까 고민했던 것 같은데..흠..🤔ㅋㅋㅋ

 

요즘은 버튼의 텍스트가 길어질 경우엔 말줄임 처리가 되도록 작업하고 있다. 

'웹공부 > css' 카테고리의 다른 글

absolute anchor tag not work in ie  (0) 2021.02.02
pure css animation - slot machine  (1) 2021.01.21
아이콘이 있는 버튼만들기  (0) 2018.09.19
css position 알아보기  (0) 2018.08.18
css calc() 함수  (0) 2018.08.06