부트 스트랩에 빈 그리드 공간을 추가하십시오. 3

Question

여기에 문제가 있으며 올바르게 해결하는 방법을 알고 싶습니다.

내 Bill to: 필드 위에 빈 셀을 추가하여 모든 것이 청구서에서 아래로 정렬되도록합니다.

이 작업을 수행하는 적절한 방법은 무엇입니까? 또한 부트 스트랩의 유동성을 깨고 싶지 않습니다.

Answer 1

당신은 입력 '로 법안'(패딩과 마진 부트 스트랩이 box-sizing: border-box를 사용하기 때문에 포함) 단일 라인 입력의 전체 높이에 해당하는 위쪽 여백을 줄 수 있습니다.

레이아웃이 축소되는 작은 뷰포트에 빈 공간을 추가하지 않으려면 적절한 min-width 중단 점 위에 여백을 추가해야합니다. 그 자체가 여기에 사용하는 부트 스트랩

당신은 중단 점을 볼 수 http://getbootstrap.com/css/#grid

/* Extra small devices (phones, less than 768px) */ 
/* No media query since this is the default in Bootstrap */ 

/* Small devices (tablets, 768px and up) */ 
@media (min-width: @screen-sm-min) { ... } 

/* Medium devices (desktops, 992px and up) */ 
@media (min-width: @screen-md-min) { ... } 

/* Large devices (large desktops, 1200px and up) */ 
@media (min-width: @screen-lg-min) { ... } 

Answer 2

그냥 스타일 = 거기 입력을 추가 "가시성 : 숨겨진"인라인 당신은 황금있어 ...

<div class="form-group"> 
     <input type="text" class="form-control" style="visibility:hidden"> 
    </div> 

http://www.bootply.com/N33euRUtGt

@media 쿼리를 추가하면 visibility:hidden에서 display:none으로 변경됩니다.격차가 사라질 수 있도록임계 섹션은 스택 때

.show-hide{display:none;} 

@media (min-width:960px){ 
    .show-hide{display:inline;visibility:hidden;} 
} 

http://www.bootply.com/pAJbN5jEpL