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>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
因为字体!!他的grid是用 display inline-block 横向平铺的原理实现的
你看他的样式里面引入了一个字体的,要么修改他的源码里面letter-spacing:-0.43em [依稀记得类似这样子]这个值的大小,要么也引入他的那个字体
总之这是一个坑
对，是字体问题，我查到了这篇，写的比较详细。
yui的解决方案好像是针对字体的。然后我这里字体和那个letter-spacing不匹配，就会有bug(貌似)。
我现在直接用cssfonts了，其他先不管了。