내 버튼을 부트 스트랩이있는 중앙 화면에 놓으려고합니다. 3

Question

이 사이트에서 다양한 기사와 답변을 찾아 보았습니다. 그 중 대중적인 대답은 <div class="text-center">을 사용하는 것으로 보이지만, 저에게는 효과가 없었습니다. 버튼은 화면의 가장 왼쪽에서 시작됩니다. 부트 스트랩 내에서, 스타일 시트에 새로운 클래스를 추가하는 대신, 그것을 어떻게 유지할 수 있는지 생각해보십시오. 감사. 내가 지금이

코드입니다 : 당신은 그리드를 사용하고, 그들에게 센터를 정렬해야

   <div class="text-center"> 
        <%= image_tag 'logo_for_web.png' %> 
    <h3>Header here</h3> 

    <h4> 
        Text here 
    </h4> 

    <h4> 
        Text here 
    </h4> 

    <%= link_to "Sign up", '#', class: "btn btn-primary col-xs-11" %> 

    <%= link_to "Log in with Facebook", '#', class: "btn btn-primary col-xs-11" %> 
    <%= link_to "Log in with email", '#', class: "btn btn-primary col-xs-11" %> 
    <%= link_to "Use without signing up", '#', class: "btn btn-primary col-xs-11" %> 
    <%= link_to "About Us", { controller: "static_pages", action: "about"}, class: "btn btn-primary col-xs-11" %> 
    <%= link_to "Contact Us", '#', class: "btn btn-primary col-xs-11" %> 


</div> 

Answer 1

. 부트 스트랩에는 총 12 개의 그리드 열이 있습니다. 그래서;

<div class="row"> 
    <div class="col-md-6 col-md-offset-3"> 
     <!-- Your Buttons Here --> 
    </div> 
</div> 

Answer 2

내가 결국 (내 응용 프로그램은 주로 모바일 이루어지고)이었다 사용하는 것 : 그것에 대해

<div class="container"> 
    <div class="row"> 
     <div class="col-xs-10 col-xs-offset-1 "> 
     <%= link_to "Log in with Facebook", '#', class: "btn btn-primary btn-lg btn-block" %> 
     <%= link_to "Log in with email", '#', class: "btn btn-primary btn-lg btn-block" %> 
     <%= link_to "Sign Up", '#', class: "btn btn-primary btn-lg btn-block" %> 
     <%= link_to "Use without signing up", '#', class: "btn btn-primary btn-lg btn-block" %> 
     <%= link_to "About Us", { controller: "static_pages", action: "about"}, class: "btn btn-primary btn-lg btn-block" %> 
     <%= link_to "Contact Us", '#', class: "btn btn-primary btn-lg btn-block" %> 
     </div> 
    </div> 
</div>