Material Design Lite抽屉破坏导航链接上的网站点击

我在为Ruby on Rails应用程序进行布局时遇到了一个奇怪的错误。Material Design Lite抽屉破坏导航链接上的网站点击

这是我目前的布局：

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>test</title> 
    <%= csrf_meta_tags %> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> 
    </head> 
    <body> 
    <div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer"> 
     <header class="mdl-layout__header"> 
     <div class="mdl-layout__header-row"> 
      <span class="mdl-layout-title">CTC151</span> 
     </div> 
     </header> 
     <div class="mdl-layout__drawer"> 
     <span class="mdl-layout-title">Test</span> 
     <nav class="mdl-navigation"> 
      <%= link_to('Home', root_path, class: 'mdl-navigation__link') %> 
      <%= link_to('News', news_index_path, class: 'mdl-navigation__link') %> 
      <%= link_to('Departments', root_path, class: 'mdl-navigation__link') %> 
     </nav> 
     </div> 
    </div> 
    </body> 
</html>

单击导航抽屉里的任何链接将打破我的布局像这样：before，after。整个网站被限制在顶部的那个小空间内。我删除了任何个性化的样式表，以确保它不是问题的根源。唯一的样式表是MDL和MDL图标

来源

2017-08-09 Simon Landry

你能否给我们提供一个能够重现问题的演示？我把它放在一起，我没有看到它https://codepen.io/mcoker/pen/KvmbWX?editors=1010 –

我认为这个错误与MDL如何通过[this]集成到我的项目中有关（ https://github.com/cllns/material_design_lite-rails）宝石。简单地将链接包括到我的布局中，就像您所做的似乎解决了我的问题。 –

我通过禁用我的应用程序中的Turbolinks来修复我的网站。最有可能的解决方法是，但AFAIK MDL默认不支持Turbolinks。

来源

2017-08-11 22:55:53

Material Design Lite抽屉破坏导航链接上的网站点击

回答

相关问题