모바일웹에서의 텍스트겹침
관련링크
본문
영카트 쇼핑몰 작업중 PC웹에서는 카테고리 메뉴가 정상적으로 나오는데
모바일웹에서는카테고리 메뉴텍스트가 겹쳐져서 보여지네요.
환경은 g5_shop_category의 ca_name 컬럼에
<span><i class="fas fa-laptop fa-fw"></i> ELECTRONIC ITEM</span>
를 넣어서 불러온값입니다.
해당 쇼핑몰 모바일 주소 http://egshop.dothome.co.kr/kr/?device=mobile 입니다
정상적으로 나오는 웹주소 http://egshop.dothome.co.kr/kr/?device=pc 입니다
CSS문제는 아닌듯한데.. 어디가 문제일까요 혹시 비슷한 경험 있으신분 계신가요?
답변 3
all.css에서 아래의 부분의 넓이를 바꿔주시거나
.fa-fw { text-align: center; width: 2.25em; }
아니면 아래와 같이
.fa-fw {text-align: center; width: auto; padding-right: 10px;}
이런식으로 해주시면 될 듯하네요
잘은 모르겠습니다만, fa-fw 를 빼면 되는 것 같습니다.
<i class="fas fa-laptop">
답변 감사드립니다. 마르스컴퍼니님 fa-fw가 폰트어썸 아이콘 정렬하는 부분이라 뺄수가 없습니다. ㅠㅠ
항상 답변 감사드립니다. 볼피드님
한번 해보겠습니다.
답변을 작성하시기 전에 로그인 해주세요.