안녕하세요?
오늘의 포스트는 아래 이미지와 같이
창이 작아지는 경우 tinyMCE 에디터를 통해서 입력한 이미지가 넘치는 경우를 방지하는 작업을 해보고자 합니다.
TinyMCE 이미지 오류
위의 이미지를 보시면, 창이 작아지는 것에 맞춰서 이미지가 작아지지 않고 옆으로 튀어나가버리는데요,
이를 막기 위해서 해당 페이지의 css 파일을 수정해야합니다.
css파일을 열고(또는 해당 페이지의 style 태그 부분에) 아래 부분을 추가해줍니다.
img {
max-width: 100%;
height: auto;
}
저장 후 다시 페이지를 새로고침하여 조회해보면 아래와 같이 이미지가 창 크기에 맞춰서 작아진 것을 볼 수 있습니다.
비슷하게 hyperlink 가 줄바꿈이 안되는 문제도 아래의 부분을 css 파일에 추가해주면 해결이 됩니다.
a {word-wrap: break-word; max-width:100%;}Reference
