对熟悉 Flexbox 的人有一个简短的问题。
我有一排 4 个弹性项目。我希望在第一个断点 ( max-width:1024px) 处将它们包装成 2 列，每列 2 列。我以为我可以使用 flex 容器内每个项目的宽度上的 % 值来实现这一点，但事实并非如此似乎工作。
代码在这里：
http://codepen.io/reskk/pen/rrpdVm
我想我可以通过在 2 内一次包装弹性项目 2 来实现这一点 <div>秒。然而，这只会在布局和使页面对称方面产生更多的工作。
有没有办法只使用宽度百分比或类似的东西来做到这一点？
例如：
25% 基线宽度 - 每行 4
50% 宽度 @ 1024px - 每行 2
100% 宽度 @ 769px - 每行 1
谢谢，
里克
我正在尝试创建一个具有2个项目的flex容器-文本div和图像div。
但是我在将图像保持在容器本身中时遇到了实际问题。当我将浏览器调整为较小的宽度时，图像只会从容器中溢出，而我似乎无法理解为什么会发生这种情况。这些物品肯定应该留在容器中吗？
代码在这里：
<div class="featured-blog">
<div class="featured-blog-main">
<h2>Featured Blog</h2>
<div class="blog-flex">
<div class="blog-text">
<h3>Easter Island</h3>
<p>Turpis sed tempus integer erat, pellentesque tortor nisl, eros viverra, integer vehicula taciti sapien sed nisl dui, nec litora tincidunt cum non lobortis sollicitudin. Et odio duis cum magna pretium. Enim augue odio. Non nec velit sed lacus in. Enim vitae pellentesque nec phasellus, quis in vitae, leo in eros donec, pede volutpat. Donec nunc mi vel, quis malesuada, sed proin curabitur orci ipsum volutpat, …