萨斯苏西画廊：横跨两列的元素 [英] Sass Susy gallery: element that spans two columns

问题描述

我需要制作一些susy的画廊mixin的两个栏目，问题是如图所示，即使我尝试手动执行该操作，也不会将其他元素推后。这怎么可能做到。
https://github.com/iyedg/IGBlogTheme 的链接 p>

解决方案

这里是关于具有不同尺寸项目的画廊的完美教程。

主要观点是：您无法通过 gallery（） mixin，但可以通过类似于 span（） mixin
<

  $ susy：（columns：12，output：isolate）; //假设输出设置为isolate.gallery__item {margin-bottom：排水沟（）; @include span（12分之4）; &：n-child（4），&：n-child（7），{width：span（8 of 12 split）; }}  

I need to make some elements of susy's gallery mixin span two columns, the problem is as shown in the picture it does not push the other elements after it, even though I tried to do that manually. How could this be done. The link to the code https://github.com/iyedg/IGBlogTheme

解决方案

Here is the perfect tutorial about gallery with different size items.

And the main point is: You can't achieve this with gallery() mixin, but it's possible with span() mixin by something like

$susy: (
  columns: 12, 
  output: isolate
);

// Assuming output is set to isolate
.gallery__item {
  margin-bottom: gutter();
  @include span(4 of 12 split); 

  &:nth-child(4),
  &:nth-child(7), {
    width: span(8 of 12 split);
  }
}

这篇关于萨斯苏西画廊：横跨两列的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！