묻고답하기
부트스트랩 적용하는 팁좀 알려주세요
2014.07.10 19:10
안녕하세요
모듈개발을 거의 끝마쳤는데요, 디자인이 워낙 이상하게 나와서 부트스트랩으로 입히려고 노가다중입니다.
그런데 XE 1.7 버전은 순수(?)한 부트스트랩이 벌써 자리를 잡고 있어서
제가 모듈 header 페이지에서 js 와 css 를 부트스트랩으로 불러들여서 사용하려하니
기존의 레이아웃이 엉망이 되어버리는 불상사가 나옵니다(제가 만든것만 잘 나오구요...)
container 부분에는 적용이 어느정도 되는데 레이아웃에 있는 '로그인'부분이나 '메뉴'부분들이 사방팔방으로 막 흩어집니다.
그리하여.... 각고그이 고심끝에 이렇게 최후의 수단으로 여러분께 여쭙습니다.
어떻게 해야 제가 원하는 부트스트랩의 디자인을 XE에서 충돌없이 사용할 수 있을까요?
부트스트랩의에서
table, label, tooltip, popover, Modal 딱 이렇게만 사용하면 되는데 부트스트랩이 막 서로 충돌이 나고 그러니 도저히 엄두가 안납니다.
고수님들 좀 알려주실 수 있으신지요.... 부탁드립니다
댓글 2
-
부트스트랩의 아래 부분이* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}padding의 높이를 인정해 주지 않기에 일반 css를 깨지게 만드는 겁니다.해결책은 일일이 깨지는 부분마다깨지는 class 또는 id{-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box;}이렇게 새로 값을 설정해 주셔야 합니다.
-
뀰귤
2014.07.10 22:32
알려주셔서 너무 감사합니다. 아참, 만들어 배포하셨던 레이아웃 예쁘게 잘 쓰고 있어요.
ㅋㅋㅋ 지금 적용하면서 엉클어지는 레이아웃이 Dooweb님이 만들어 배포하신 레이아웃.... 영광입니다.
그런데
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
이부분이 pdding의 높이를 인정해 주지 않는다면.... 깨지는 id 또는 class 를 어떻게 하면 알 수 있는지요...
제가 크롬의 '개발자 도구'로 한번씩 class나 요소들을 바꿔보는데 아직 진전이 없어서 답답해서요.
모쪼록 힌트 주셔서 너무 감사하고 영광입니다.
