这个 css ' float: left ' 来自哪里—— Jekyll答案

【问题标题】：Where is this css ' float: left ' coming from -- Jekyll这个 css ' float: left ' 来自哪里—— Jekyll
【发布时间】：2015-02-12 06:30:53
【问题描述】：

我正在使用 Jekyll CMS

标头有一个基本结构

<div class="top">

</div>


<div class="header-wrapper">

  <div class="header-left"><img src="/assets/images/lawmen1.png" alt="Law and Lawson Attorney at Law Lawyers City State"></div>
  <div class="header-right">
    <ul>
      <li><i class="fa fa-location-arrow fa-2x"></i>250 W. Main Street Suite 2510<br>City, State 90210</li>
      <li><i class="fa fa-mobile fa-2x"></i>(555) 555-555</li>
      <li><i class="fa fa-fax fa-2x"></i>(555) 555-5555</li>
    </ul>
  </div>

</div>

这里是css

@import '1-tools/-tools-index';


.top{
  width:100%;
  height: 30px;
  background-color: #1A1A1A;
}


.header-wrapper{

  @include outer-container;
  padding-bottom: 2.5em;


  .header-left{
    @include span-columns(4);
    height: 200px;
    img{
      display:block;
      margin: 0 auto;
      padding: 2.8em;
      height:285px;
      width:325px;
    }
  }

  .header-right{
    margin-top:2.5em;
    height: 200px;

    @include span-columns(8);
    ul{
      li{
        font-family: Garamond;
        color: grey-color-dark;
        font-size: 1.1em;
      }
    }

    i{
      padding:0.2em;
      height: 50px;
      width:50px;
      color: #d3bc5f;
    }
  }
}

所以，你可以看到我在 css 中没有故意使用float: left。

但是，您可以在检查元素的屏幕截图中看到 Jekyll 在 main.scss 中生成了float: left

我在 css 中使用的语法会影响这个吗？如。 .

<div class = "outside">
 <div class = "left"></div>
 <div class = "right"></div>
</div

.outside {
 .left {

 }
 .right {

 }
 }

这样嵌套css可以吗？

【问题讨论】：

它可能是由您正在使用的包含提供的。

标签： css sass css-float jekyll

【解决方案1】：

这来自 _sass/1-tools/neat/grid/_span-columns.scss 文件。通过阅读文档，我们了解到我们可以通过执行以下操作将float 和显示属性删除到table-cell：

@include span-columns(8, 'table');

【讨论】：