개발 Q&A

제목 bootstrap3 관련 질문입니다.
글쓴이 세크티 작성시각 2014/01/09 12:00:50
댓글 : 4 추천 : 0 스크랩 : 0 조회수 : 19002   RSS
 이번 신규 프로젝트에 부트스트랩3를 쓸려고 공부중인데요..

2버전에 있던 fluid요런게 없어졌더라구요.

지금 문제가 되는부분이 그리드의 각 컬럼에 좌우 패딩값이 15px이 들어가는데요.

이게 <div class='container'>에서는 상관이 없는데 만약 가운데로 땡겨서 컨텐츠를 만드는게 아니라

전체 풀사이 만들경우 <div class='row'>의 마지막 컬럼에 padding-right가 15px이 붙으면서 가로 스크롤바가 생겨버립니다.

<div style='width:1300px'>로 감싸도 뚫고 나오네요..

방법이 없으면 <div style='width:100%;overflow:hidden'> 으로 매번 감싸서 해야할까요..ㅠㅠ
 다음글 여러개의 체크박스 DB처리를 어떻게해야할까요? (3)
 이전글 동시접속자 수 관련 질문 드립니다. (11)

댓글

수야디벨 / 2014/01/09 18:28:52 / 추천 0
부트스트랩은 프레임워크가 아니잖아요?ㅎ

어떤 스타일의 사이트를 만드는지는 모르지만 ,

직접 bootstrap.css 의 css를 바로 수정하셔도 됩니다 .

뭐 .. 예를들어서 row 클래스에서는 padding값이 영원히 없어도 되겠다 싶으면

bootstrap.css에서 해당 부분을 지워버리면 되겠죠?


솔직히 지금 물어보신건 퍼블리싱 관련된건데 ,

해결 방법은 위에거 말고도 무궁 무진하지만 ,

마지막에 매번 감싸야 할까요 .. 라고 물어보시는 말에 힌트를 얻어 ,

해당 클래스의 padding 속성은 매번 필요없다고 판단하여 드리는 해결책 입니다^^





구치리 / 2014/01/10 10:06:18 / 추천 0
bootstrap.css 를 건드는 방법도 있겠고
저같은 경우는 원본 파일을 건드리기 싫어서 

custom.css 를 만들어서 해당 속성에 원하는 값을 추가하는 방법을 씁니다.
크롬 같은 경우 해당 부분을 요소 검사 해보면
그 부분에 영향을 미치는 css 가 나오잖아요
그 css부분을 custom.css 에 덮어씌어서 사용하고 합니다.

직접적인 예시를 들어드리자면
저는 bootstrap 의 input 의 text 크기를 줄이고 싶은데(2.6 기준입니다)
bootstrap 자체는 수정하기 싫어서
헤더를 다음과 같이 꾸미고
  <link rel="stylesheet" href="<?php echo base_url('asset/css/bootstrap.css');?>">
  <link rel="stylesheet" href="<?php echo base_url('asset/css/bootstrap-responsive.css');?>">
  <link rel="stylesheet" href="<?php echo base_url('asset/css/custom.css');?>">
input 부분을 요소 검사하여 꾸며져 있는 css 부분을 확인하고
custom.css 에 적용하여 css 속성이 덮어씌어지도록 하였습니다.
select, 
textarea, 
input[type="text"], 
input[type="password"], 
input[type="datetime"], 
input[type="datetime-local"], 
input[type="date"], 
input[type="month"], 
input[type="time"], 
input[type="week"], 
input[type="number"], 
input[type="email"], 
input[type="url"], 
input[type="search"], 
input[type="tel"], 
input[type="color"], 
.uneditable-input {
  font-size: 12px;
  margin-bottom: 0px;
}
사실 내용은 길고 별거 아닌데
구체적으로 설명해드리고 싶어서 자세하게 적어보았습니다.
도움이 되셨으면 좋겠습니다.
케이든 / 2014/01/10 10:53:02 / 추천 0
세크티 / 2014/01/10 11:20:12 / 추천 0
 답변 주신분들 감사드립니다!!^^
덕분에 잘 해결되었습니다.