[CSS 샘플] 영문으로 인한 자간 문제

카테고리 없음 2020. 9. 16. 12:28

본문에 한글과 영문이 섞여 있을 때, 특히 영문이 길면 영어 단어가 다음줄로 내려가면서 자간이 벌어집니다.

 

해결할 방법이 딱히 없어 이럴 경우 word-break를 사용했어요.

word-break를 쓰면 영어 단어가 강제로 잘리면서 줄바꿈이 됩니다.

그런데 이럴 때 문제가 생겨요.

 

나는 duckbill을 좋아한다.

 

word-break를 쓰면 이 문장이 이렇게 잘릴 수 있습니다.

 

나는 duck

bill을 좋아한다.

 

의미가 완전히 바뀝니다.

 

duckbill이 붙어있으면 '오리너구리'가 되는데

duck bill은 '오리 부리', 네이버 파파고에서는 '어음을 환수한다'고 번역이 되네요.

 

영어는 한 단어를 잘라 줄바꿈 할 때 하이픈을 넣습니다.

 

나는 duck-

bill을 좋아한다.

 

이렇게 하면 duck bill이 아니고 duckbill이라는 뜻이에요.

 

어떻게 하면 자동으로 하이픈을 넣을 수 있을까요?

 

CSS에 hyphens: auto; 라는 스타일이 있지만, 이 스타일은 제대로 적용이 안됩니다.

 

이 문제를 해결 할 방법이 없을까 고민하다 재미있는 코드를 하나 찾았어요.

 

­

 

이걸 안써본건 아닙니다. 예전에 이 코드를 시도해 봤어요. 그런데 EPUB에 쓸 수 없는 코드였지요.

그러다 별 생각 없이 눌러 본 Sigil에서 특수 문자 삽입 창에서 shy를 우연히 발견했습니다.

'왜 쓸 수 없는 shy가 들어있는거지?'

생각하며 눌렀는데, 헉... 이게 먹히네요.

­는 안먹히는데, 코드 번호로 넣으니 되더라구요.

그랬지.   대신  을 쓰도록 바뀌었지... 하며 깨달음이 오네요 ㅜ.ㅜ

 

이제 이렇게 편집이 가능합니다.

 

교보와 리디 모바일 뷰어에서도 확인을 했어요.

 

영어 단어 강제로 잘라야 할 일 있을 때는 word-break;가 아닌 shy를 사용하세요~~

설정

트랙백

댓글

  • 이새의나무 2020.09.16 13:06 ADDR 수정/삭제 답글

    오 완전 꿀팁인데요~

  • 김재홍 2020.09.22 14:47 ADDR 수정/삭제 답글

    안녕하세요, 선생님. 예전 국립중앙도서관에서 강의하셨을 때 들은 이후로 수시로 참조하고 있습니다. 출간하신 책도 틈틈이 참조하고 있구요. 혹시 sigil 고급편은 언제 출간이신지 알 수 있을까요 ?
    늘 좋은 컨텐츠 공유해주셔서 감사드립니다. ^^