Yocker
  1. Yocker
  3. Sass Variabile nella funzione calc calc ()
Intereting Posts
Come funzionano SETLOCAL e ENABLEDELAYEDEXPANSION? Predefiniti per le proprietà mancanti nei formati JSON di gioco 2 Rimuovi i caratteri unicode dai file di testo: sed, altri metodi bash / shell Come rilevare la modifica dell’URL in JavaScript Posizionamento del componente su Glass Glass tutorial di edera per il repository locale? Qual è la motivazione per portare i simboli in ES6? ottenere il tipo T da IEnumerable Chiamata alla stored procedure da Java / JPA Come posso unire due commit in uno se ho già avviato rebase? jQuery trova elemento in base al valore dell’attributo dei dati Accesso ai controlli di Asp.net utilizzando jquery (tutte le opzioni) Come forzare HTTPS usando un file web.config Etichette dell’asse su due righe con variabili x annidate (anno sotto i mesi) gitignore dopo il commit

Sass Variabile nella funzione calc calc ()

Sto cercando di utilizzare la funzione calc() in un foglio di stile Sass, ma sto avendo alcuni problemi. Ecco il mio codice: 

 $body_padding: 50px body padding-top: $body_padding height: calc(100% - $body_padding)

Se uso il letterale 50px invece della mia variabile body_padding , ottengo esattamente quello che voglio. Tuttavia, quando passo alla variabile, questo è l’output: 

 body { padding-top: 50px; height: calc(100% - $body_padding); }

Come posso convincere Sass a riconoscere che è necessario sostituire la variabile all’interno della funzione calc ?

Interpolare: 

 body height: calc(100% - #{$body_padding})

In questo caso, anche border box sarebbe sufficiente: 

 body box-sizing: border-box height: 100% padding-top: $body_padding

Prova questo: 

 @mixin heightBox($body_padding){ height: calc(100% - $body_padding); } body{ @include heightBox(100% - 25%); box-sizing: border-box padding:10px; }