私はSCSSスタイルシートに取り組んでいる、と私は次のようになりますルールを持っている要素

Question

でセレクタを拡張するためにSASSを使用した：

.footer-link-row { 
    color: red; 
    ul& { 
     padding: 0; 
    } 
} 

私はul&ラインは、セレクタul.footer-link-rowにコンパイルします。ただし、このセレクタはコンパイラエラーを返し、&ulを使用すると.footer-link-row ulにコンパイルされます。このようなものを選択する正しい方法は何ですか？明確にするために

--Added--
、私はこのうちたい最終的なCSSは次のとおりです。

.footer-link-row { 
    color: red; 
} 
ul.footer-link-row { 
    padding: 0; 
} 

Answer 1

あなたは、次のような何かをしたい：

ul { 
    padding: 0; 
    .footer-link-row { 
    color: red; 
    } 
} 

アンパサンドをするために使用されます両方のセレクタが一致することを要求する

a { text-decoration: none; 
    &:hover { border-width: 1px } 
} 
// compiles to 
a { 
    text-decoration: none; 
} 
a:hover { 
    border-width: 1px; 
} 

ul.footer-link-row try

ul { 
    &.footer-link-row { 
    padding: 0; 
    } 
    .footer-link-row { 
    color: red; 
    } 
} 

あなたの明確化は、2つのスコープが必要であることを示しています。 ``クラスフッターリンクを持っているすべての `ul`年代、ちょうど` ul`年代に適用する; 0：かなり私が欲しいもの...私は `パディングを望んでいないいない

ul { 
    &.footer-link-row { 
    padding: 0; 
    } 
} 

.footer-link-row { 
    color: red; 
}