部分不在轨道中渲染

Question

尝试呈现以下部分：_no_login_required_links.html.erb @root / index

<li id="hobby">
  <%= link_to hobby_posts_path do %>
    <i class="fa fa-user-circle-o" aria-hidden="true"></i> Find a hobby 
buddy
  <% end %>
</li>

 <li id="study">
   <%= link_to study_posts_path do %>
    <i class="fa fa-graduation-cap" aria-hidden="true"></i> Find a 
study buddy
  <% end %>
</li>

<li id="team">
  <%= link_to team_posts_path do %>
    <i class="fa fa-users" aria-hidden="true"></i> Find a team member
  <% end %>
</li>

所以我将它放在另一个名为_side_menu的部分中

这是_side_menu的内容

<div id="side-menu"  class="col-sm-3">
  <ul id="links-list">
   <%= render 'pages/index/side_menu/no_login_required_links' %>
 </ul>
</div>`

出于某种原因，当我进入主页时它不会呈现，但是当我将部分放在这个文件中时：_main_content.html.erb，就像这样渲染......

<div id="main-content" class="col-sm-9">
  <%= render @posts %>
  <%= render 'pages/index/side_menu/no_login_required_links' %>
</div><!-- main-content -->` 

这是我的index.html.erb文件

<%= render 'posts/modal' %>

<div class="container">
  <div class="row">
      <%= render 'pages/index/side_menu' %>
      <%= render 'pages/index/main_content' %>
  </div><!-- row -->
</div><!-- container -->

我不想在主要内容部分中呈现侧面菜单，但是出现这种情况的原因是什么？

Answer 1

我解决了这个问题...

我有一个名为mobile.scss的scss，它根据正在查看的设备的屏幕大小调整网页样式。

在mobile.scss中，我有以下样式：

@media screen and (max-width: 767px) {
  .pc-menu {
    display: none !important;
  }
 }


#side-menu {
     display: none !important;
  }

#side-menu应该存在于@media screen and (max-width: 767px)内

因为它不是，所以无论屏幕尺寸如何，都将侧面菜单全部隐藏起来。

将#side-menu放在@media screen内解决了这个问题。