purecss 的 grid 样式问题_问答-阿里云开发者社区

网址是这个

我本地笔记本mac测试(chrome，safari)的时候，一行三列那个grid一切正常。但是用台式机windows测试的时候(chrome，360，ie，ff等)，就只有两个pure-u-1-3在一排，另一个到下一排去了，不知道为什么。但是用IE，FF显示良好。

我看了笔记本和台式机chrome版本都是最新的啊。莫非是屏幕宽度问题？那为啥IE又显示正确了呢。

我打开官方示例的时候无论什么浏览器都没有问题。

我个人感觉可能是 1. 屏幕尺寸问题 2. 其他样式干扰 *

不过我纯业余啊，完全不懂前端啊！我也不知道那个Refinery CMS自带的样式哪些可以由purecss代替的，直接删掉的。感觉直接覆盖应该没有问题才对啊！

求大虾帮忙！

<div class="pure-g-r">
  <div class="pure-u-1-3">
  </div>
  <div class="pure-u-1-3">
  </div>
  <div class="pure-u-1-3">
  </div>
</div>
<!DOCTYPE html>
<%= render '/refinery/html_tag' %>
  <% site_bar = render('/refinery/site_bar', :head => true) -%>
  <%= render '/refinery/head' %>
  <body>
    <%= site_bar -%>
    <%= render '/refinery/ie6check' if request.env['HTTP_USER_AGENT'] =~ /MSIE/ -%>
    <div id="page_container">
      <header id="header">
        <%= render '/refinery/header' -%>
      </header>
      <section id="page">
        <%= yield %>
      </section>
      <footer>
        <%= render '/refinery/footer' -%>
      </footer>
    </div>
    <%= render '/refinery/javascripts' %>
  </body>
</html>
<head>
  <meta charset='<%= Rails.application.config.encoding %>' />
  <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><![endif]-->
  <title><%= browser_title(yield(:title)) %></title>
  <%= raw %(<meta name="description" content="#{@meta.meta_description}" />) if @meta.meta_description.present? -%>
  <%= raw %(<meta name="keywords" content="#{@meta.meta_keywords}">) if @meta.meta_keywords.present? -%>
  <%= raw %(<link rel="canonical" content="#{@canonical}" />) if @canonical.present? -%>
  <%= csrf_meta_tags if Refinery::Core.authenticity_token_on_frontend -%>
  <%= yield :meta %>

  <%= stylesheet_link_tag "application", "formatting", "theme" %>
  <%= stylesheet_link_tag "home" if home_page? %>
  <%= yield :stylesheets %>

  <%= render '/refinery/google_analytics' %>

  <%= javascript_include_tag 'modernizr-min' %>
</head>

purecss 的 grid 样式问题

相关文章

相关电子书