Comment l'utiliser !par défaut dans un mixin SASS?

J'ai ce mixin SASS:

@mixin micro-clearfix
    &:after,
    &:before
        content: ""
        display: table
    &:after
        clear: both
    * html &
        height: 1% !default
    *+html &
        min-height: 1% !default

Malheureusement, il ne compile pas, à moins que j'ai supprimer !default qui serait le point d'avoir ce mixin.

Le message d'erreur que j'obtiens est:

Invalid CSS after "1% ": expected expression (e.g. 1px, bold), was "!default")

Ce que j'aimerais atteindre, c'est que si height (ou min-height) a déjà été défini pour le sélecteur, le mixin utilisez cette valeur, sinon il doit définir cette propriété à 1%.

Je ne souhaite pas utiliser zoom puisque ce n'est pas une propriété valide et je tiens à garder mon CSS propre.

Suis-je à l'aide de !default dans le mauvais sens?

J'ai Boussole 0.12.1 et SASS 3.1.10.

!default est utilisé avec Sass les déclarations de variables, pas de propriétés CSS.

OriginalL'auteur Wabbitseason | 2012-04-27

  1. 14

    !default est destinée à être utilisée uniquement lors de la déclaration de variables: http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#variable_defaults_

    Ce que vous essayez de faire, doit être fait avec CSS !important de la déclaration de, qui devraient être utilisés dans la règle à l'extérieur de la mixin (celui que vous voulez l'emporter). De toute façon, à l'aide de !important habituellement, il n'est pas une bonne pratique. Peut-être que vous pouvez compter sur la cascade ou la spécificité.

    Merci pour la réponse, mais comme vous l'avez mentionné à l'aide de !important est généralement déconseillé, donc je ne peux pas accepter votre réponse, j'ai d'ailleurs trouvé une solution moi-même.

    OriginalL'auteur Waiting for Dev...

  2. 8

    Voici comment je l'ai fait finalement:

    @mixin micro-clearfix
    $minHeight: 1% !default
    &:after,
    &:before
        content: ""
        display: table
    &:after
        clear: both
    * html &
        height: $minHeight
    *+html &
        min-height: $minHeight
    Pourquoi ne pas passer en $minHeight à votre mixin et de définir la valeur par défaut comme @mixin micro-clearfix($minHeight: 1%)?

    OriginalL'auteur Wabbitseason