SASS neden pseudo_expr gibi `& :: not (: first-child)` derleyemiyor?</p> <pre><code>Error: Invalid CSS after "&::not(": expected pseudo_expr, was ":first-child)" </code></pre> <p>beklenen CSS kodu aşağıdaki gibi görünmelidir:

Question

Ben

.floating-label-form-group { 
    position: relative; 
    margin-bottom: 0; 
    padding-bottom: .5em; 
    border-bottom: 1px solid #e1e1e1; 
    input, textarea { 
    z-index: 1; 
    position: relative; 
    padding-right: 0; 
    padding-left: 0; 
    border: 0; 
    border-radius: 0; 
    font-size: 1.5em; 
    background: 0 0; 
    box-shadow: none!important; 
    resize: none; 
    } 
    label { 
    display: block; 
    z-index: 0; 
    position: relative; 
    top: 2em; 
    margin: 0; 
    font-size: .85em; 
    line-height: 1.764705882em; 
    vertical-align: middle; 
    vertical-align: baseline; 
    opacity: 0; 
    -webkit-transition: top .5s ease,opacity .5s ease; 
    -moz-transition: top .5s ease,opacity .5s ease; 
    -ms-transition: top .5s ease,opacity .5s ease; 
    transition: top .5s ease,opacity .5s ease; 
    } 
    &::not(:first-child) { 
    padding-left: 14px; 
    border-left: 1px solid #e1e1e1; 
    } 

Ben Sass 3.4.9 kullanarak derlemek, bu şikayet (SCSS dönüştür) css2sass tarafından aşağıdaki pasajı var:

.floating-label-form-group::not(:first-child){ 
    padding-left:14px;border-left:1px solid #e1e1e1} 

Ancak SUKDÖ'nün CSS içine &::not( derlemek bilmiyor gibi görünüyor. Bunu düzeltmekle ilgili bir fikri olan var mı?

Answer 1

Aslında, Sass haklı: bu gerçekten geçersiz CSS. :not() sahte sınıf değil, bir sözde eleman, bu nedenle sadece bir iki nokta üst üste sahip olmalıdır:

&:not(:first-child) { 
    padding-left: 14px; 
    border-left: 1px solid #e1e1e1; 
    } 

Answer 2

Yeri etrafında tırnak: first-child, aşağıdaki kod

.floating-label-form-group::not(':first-child') { 
    padding-left: 14px; 
    border-left: 1px solid #eee; 
} 

Rais 4'te benim için çalıştı