簡體   English   中英

引導網格偏移未居中

[英]Bootstrap grid offset not centering

嘗試將我的注冊頁面居中,但我的class="col-md-4 col-md-offset-4"無法正常工作。 我知道還有其他方法可以使文本居中,但是我只想知道我在代碼中做錯了什么,因此我知道以后可以避免這樣做。

我的HTML是:

<div class="container">
 <div class="row">
  <div class="col-md-4 col-md-offset-4">
   <div class="well">
            <h2>Sign up</h2>

    <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
      <%= devise_error_messages! %>

      <div class="field">
        <%= f.label :email %><br />
        <%= f.email_field :email, autofocus: true %>
      </div>

      <div class="field">
        <%= f.label :password %>
        <% if @minimum_password_length %>
        <em>(<%= @minimum_password_length %> characters minimum)</em>
        <% end %><br />
        <%= f.password_field :password, autocomplete: "off" %>
      </div>

      <div class="field">
        <%= f.label :password_confirmation %><br />
        <%= f.password_field :password_confirmation, autocomplete: "off" %>
      </div>

      <div class="actions">
        <%= f.submit "Sign up" %>
      </div>
    <% end %>

    <%= render "devise/shared/links" %>
   </div>
  </div>
 </div>
</div>

我讀過其他文章,他們的回答僅僅是他們忘記了容器標簽之類的東西。 在引導文檔中也找不到任何答案。 我假設這是我忽略的小事。

只需將col-md-offset-4更改為offset-md-4即可,因為引導程序4更改了此設置

<div class="row">
  <div class="col-md-4 offset-md-4">

這是這個的參考

<div class="row">
   <div class="col-md-4 text-center">

嘗試這個。 那是我大多數時候使用的。

不知道發生了什么。 我刪除了一些代碼之間的中斷,並且它起作用了。 我把斷線放回去,它仍然有效。 我不知道。 也許我的瀏覽器有問題? 完全不知道,但是現在可以正常工作

您必須將此部分更改為波紋管。

<div class="row">
  <div class="col-md-4 offset-md-4">

只需更改此部分。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM