banana like sunshine RSS FEED

bootstrap을 기반으로 웹앱을 만들 때 가장 문제가 되는 것은 역시 IE에서 호환성 문제입니다. 

많이 해결도 되었고, IE 구버전 이용자가 점점 줄어드는 영향도 있고 하지만,아직도 IE8 이용자가 제가 관리하는 사이트에서는 15% 정도가 되다 보니 무시할 수도 없는 노릇입니다. ㅡ.ㅡ

하여튼 bootstrap3 에서는 IE 구버전에서도 룩을 유지하기 위해서 다음과 같이 처리합니다 :

하지만 이상하게 잘 먹히지를 않더군요;;

이유를 찾아보니 respond.js 는 로컬에서만 제대로 작동을 하기 때문에 위와 같이 CDN에서 읽어오면 안되는 이유였습니다. 

왜냐하면 이 respond.js 내부에서 CSS를 외부에서 AJAX로 불러와서 쓰는데.. 이때 cross-domain 이슈가 발생하기 때문입니다.

간단하게 해결하려면, 해당 파일을 로컬에 카피해서 이용하시거나.. 개발진 git에서 볼 수 있듯이 proxy를 이용해야 합니다. 

참고 :  https://github.com/scottjehl/Respond#cdnx-domain-setup 

bootstrap css 이용하다 보면.. grid system이 무척 편합니다.

조금만 신경쓰면 모든 페이지가 모바일에서도 이쁘장하게.. 역시 "mobile first"를 외치는 개발자들 답네요.

그런데 xs 사이즈까지 지원하려다 보니, 화면 사이즈를 줄이다 줄이다 보면 어쩔 수 없이 깨지게 됩니다.

그럴 때는 원하는 화면 사이즈를 min-width 로 설정해주면 됩니다.

body {
    min-width: 768px; /* <-- 이렇게 */
    margin: 0;
}

로직만 신경쓰면서 살다가 css 보려니 너무 힘드네요;;