0

我一生都无法弄清楚为什么这个嵌套的 sass 不起作用。这是我的html:

%h1 Office Listing
#office-holder
  .listing-stats··
    #address·
      =@office_listing.address
    .listing-stats-2
      #rent
        %span.special2 Rent:·
        $#{@office_listing.rent}/month
      #size
        %span.special2 Space:·
        #{@office_listing.size} sq. feet

这一切都在为 html 页面命名的 div 中,该页面有两个 id——#office_listing 和 #show。我正在使用 rails,所以我使用命名空间来巧妙地分隔我的 css 的视图。这是不起作用的CSS:

#office_listing#show {
  #address {
    width: 100%;
    font-size: 50px;
    background-color: #A0183C;
    height: 100px;
    text-align: center;
    margin: auto;
    font-size: 30px;
    padding-top: 35px;
    color: white;
  }
}

然而,CSS 没有显示。然而,CSS 似乎编译得很好。当我检查编译的样式表时,它们看起来像这样:

#office_listings#show #address {
  width: 100%;
  font-size: 50px;
  background-color: #A0183C;
  height: 100px;
  text-align: center;
  margin: auto;
  font-size: 30px;
  padding-top: 35px;
  color: white; }

这似乎应该针对适当的 HTML 元素。我错过了什么?

4

1 回答 1

2

可以双id吗?#office_listings#show意味着您在同一个元素上有两个 id。这违反了惯例,我的猜测是它不匹配。show代替上课,代替#office_listings.show #address上课

于 2013-07-27T18:23:21.323 回答