Странные проблемы с выравниванием с Rails и Materialize Значки CSS

У меня очень странная проблема с использованием значков Materialize CSS в таблице. Кажется, что они не соответствуют должным образом.Странные проблемы с выравниванием с Rails и Materialize Значки CSS

Скриншот: (. Все личные данные размыто)

Вот мой Тонкий шаблон:

.container 
    h1 
    | View Users 
    = form_for :user, url: "/users" do |f| 
    table 
     tr 
      th width="30px" ID 
      th width="80px" User ID 
      th Email Address 
      th First Name 
      th Last Name 
      th Type 
      th Notes 
      th width="20px" class="material-icons" delete 
      th width="20px" class="material-icons" mode-edit 
     - @users.each do |i| 
      tr 
      td = i.id 
      td = i.uid 
      td = i.email 
      td = i.first_name 
      td = i.last_name 
      td = i.user_type 
      td = i.notes 
      td = link_to 'delete', user_path(i), method: :delete, data: { confirm: 'Are you sure?' }, :class => "material-icons", :style => 'color: black' 
      td = link_to 'mode-edit', [:edit, i], :class => "material-icons", :style => 'color: black' 
      br 
     tr 
      td 
       input type="text" value="ID" readonly="readonly" 
      td 
       == f.text_field :uid, :id => "uid", :placeholder => "User ID" 
      td 
       == f.text_field :email, :placeholder => "Email Address" 
      td 
       == f.text_field :first_name, :id => "fname", :placeholder => "First Name" 
      td 
       == f.text_field :last_name, :placeholder => "Last Name" 
      td 
       == f.text_field :user_type, :placeholder => "Type" 
      td 
       == f.text_field :notes, :placeholder => "Notes" 
    .row 
     .actions 
     .col.s2 
      a class="waves-effect waves-light btn" 
      == f.submit "Add" 
     .col.s7 
      span 
     .col.s3 align="right" 
      a class="waves-effect waves-light btn" href="https://stackoverflow.com/users/new" Open Form

Вот мой application.html.erb:

<!DOCTYPE html> 
<html> 
<head> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= csrf_meta_tags %> 
    <!-- Compiled and minified CSS --> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css"> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 


    <!-- Compiled and minified JavaScript --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
</head> 
<body> 

<%= yield %> 

</body> 
</html>

Пожалуйста, помогите я решаю эту очень странную проблему.

источник

2016-11-08 Dmitry Kudriavtsev

Похоже, что строка со входами имеет меньше 'td', чем предыдущие строки. Можете ли вы попытаться добавить два пустых 'td' s там? –

@MuradYusufov Я немного экспериментировал с этим, но проблема все еще существует. Попытка это сейчас. –

@MuradYusufov ничего не сделал –

Оказалось, что значок, который я использовал (режим редактирования), вызывал проблемы с таблицей. Я тестировал его отдельно, и он по-прежнему вызывал эти проблемы сам по себе.

Как я исправился, проблема заключалась в изменении значка из «edit-mode» на «create». Это сразу устранило проблему.

источник

2016-11-08 19:42:37

Это не дает ответа на вопрос. Чтобы критиковать или просить разъяснения у автора, оставьте комментарий ниже их сообщения. - [Из обзора] (/ review/low-quality-posts/14230678) – Serjik

@Serjik Я автор –

Пожалуйста, используйте ссылку для редактирования по вашему вопросу, чтобы добавить дополнительную информацию. Кнопка «Ответ на сообщение» должна использоваться только для полных ответов на вопрос. - [Из обзора] (/ review/low-quality-posts/14230678) – VDWWD

Странные проблемы с выравниванием с Rails и Materialize Значки CSS

ответ

Смежные вопросы