2016-08-27 3 views
-1

부트 스트랩 3.3.7을 사용 중입니다. 본인은 페이지를 사용하여 콘텐츠를 추가했습니다.부트 스트랩 컨테이너 및 컨테이너 유체에 문제가 있음

container-fluid를 사용하면 페이지 전체에서 내용을 확장하지 않지만 크기를 페이지 중앙 영역으로 제한합니다.

컨테이너를 사용했을 때도 같은 일이 발생했습니다. 그것은 페이지의 외부에 걸쳐> 내 화면 해상도는 X 768

이 1366 그래서, 나는이 다른 사람을 포함 컨테이너입니다

<div class="container"> 

     <h4>Bootstrap Buttons</h4> 

     <!-- The Large size buttons --> 
     <p> 
     <button type="button" class="btn btn-default btn-lg">Default</button> 
     <button type="button" class="btn btn-primary btn-lg">Primary</button> 
     <button type="button" class="btn btn-success btn-lg">Success</button> 
     <button type="button" class="btn btn-info btn-lg">Info</button> 
     <button type="button" class="btn btn-warning btn-lg">Warning</button> 
     <button type="button" class="btn btn-danger btn-lg">Danger</button> 
     <button type="button" class="btn btn-link btn-lg">Link</button> 
     </p> 

     <!-- The default size buttons --> 
     <p> 
     <button type="button" class="btn btn-default">Default</button> 
     <button type="button" class="btn btn-primary">Primary</button> 
     <button type="button" class="btn btn-success">Success</button> 
     <button type="button" class="btn btn-info">Info</button> 
     <button type="button" class="btn btn-warning">Warning</button> 
     <button type="button" class="btn btn-danger">Danger</button> 
     <button type="button" class="btn btn-link">Link</button> 
     </p> 

     <!-- The small size buttons --> 
     <p> 
     <button type="button" class="btn btn-default btn-sm">Default</button> 
     <button type="button" class="btn btn-primary btn-sm">Primary</button> 
     <button type="button" class="btn btn-success btn-sm">Success</button> 
     <button type="button" class="btn btn-info btn-sm">Info</button> 
     <button type="button" class="btn btn-warning btn-sm">Warning</button> 
     <button type="button" class="btn btn-danger btn-sm">Danger</button> 
     <button type="button" class="btn btn-link btn-sm">Link</button> 
     </p> 

     <!-- The small size buttons --> 
     <p> 
     <button type="button" class="btn btn-default btn-xs">Default</button> 
     <button type="button" class="btn btn-primary btn-xs">Primary</button> 
     <button type="button" class="btn btn-success btn-xs">Success</button> 
     <button type="button" class="btn btn-info btn-xs">Info</button> 
     <button type="button" class="btn btn-warning btn-xs">Warning</button> 
     <button type="button" class="btn btn-danger btn-xs">Danger</button> 
     <button type="button" class="btn btn-link btn-xs">Link</button> 
     </p> 

    <!-- Bootstrap container & container-fluid --> 
    <!-- Bootstrap container example --> 
    <div class="container bootcontainer"> 
     <h1>Hello, world! - Using Container</h1> 
    </div> 

    <!-- Bootstrap container-fluid example --> 
    <div class="container-fluid bootcontainerfluid"> 
     <h1>Hello, world! - Using Container Fluid</h1> 

    </div> 
+0

컨테이너-액이 HTML에 많은 문제가있다 컨테이너 – Bosc

+1

의 내부입니다. 최소한의 예제로 코드를 단순화하십시오. 'container-fluid'는 부트 스트랩의 전체 너비입니다. 당신은 틀린 마크 업이나 그것을 덮어 쓰는 커스텀 CSS를 가질 가능성이 큽니다. – ZimSystem

답변

1

를 사용한 코드입니다 :

<!--Bootstrap Modal (Dialog Box/Pop-up Window) Example--> 
     <div class="container-fluid"> 
     ... 

그런 컨테이너 유체 everyw와 용기 교체 여기 당신이 필요해, 나를 위해 일했다.

0

답변을 찾았습니다. 사실 그것은 HTML 브레이크입니다. 나는 'Bootstrap Button Example'을 선언 한 후에 <div> 태그를 넣지 않았다.

어쨌든 고마워!

감사합니다, Chiranthaka

관련 문제