Calculando a largura de porcentagem a pixel, depois menos por pixel em MENOS CSS

Vou calcular a largura em algum elemento de porcentagem a pixel, então irei menos -10px usando LESS e calc () . É possível?

div {
    span {
        width:calc(100% - 10px);
    }
}

Estou usando CSS3 calc()por isso não funciona:calc(100% - 10px)

Exemplo: se 100% = 500px, então largura = 490px (500-10);

Fiz uma demonstração para teste: http://jsfiddle.net/4DujZ/55/

então o preenchimento dirá: 5 (10px / 2) o tempo todo quando eu redimensionar.

Posso fazer em menos ? Eu sei como fazer em jQuery e CSS simples como preenchimento de margem ou então ... mas vou tentar fazer funcional em menos comcalc()

Você pode escapar dos calcargumentos para evitar que sejam avaliados na compilação.

Usando seu exemplo, você simplesmente envolveria os argumentos, como este:

calc(~'100% - 10px')

Demo: http://jsfiddle.net/c5aq20b6/

Acho que uso isso de uma das três maneiras a seguir:

Escape Básico

Tudo dentro dos calcargumentos é definido como uma string e é totalmente estático até que seja avaliado pelo cliente:

MENOS entrada

div {
    > span {
        width: calc(~'100% - 10px');
    }
}

Saída CSS

div > span {
  width: calc(100% - 10px);
}

Interpolação de Variáveis

Você pode inserir uma variável LESS na string:

MENOS entrada

div {
    > span {
        @pad: 10px;
        width: calc(~'100% - @{pad}');
    }
}

Saída CSS

div > span {
  width: calc(100% - 10px);
}

Combinação de valores escapados e compilados

Você pode querer escapar de um valor percentual, mas vá em frente e avalie algo na compilação:

MENOS entrada

@btnWidth: 40px;
div {
    > span {
        @pad: 10px;
        width: calc(~'(100% - @{pad})' - (@btnWidth * 2));
    }
}

Saída CSS

div > span {
  width: calc((100% - 10px) - 80px);
}

Fonte: http://lesscss.org/functions/#string-functions-escape .

Eu acho width: -moz-calc(25% - 1em);que é o que você está procurando. E você pode querer dar uma olhada neste link para qualquer assistência adicional

Ou você pode usar o atributo de margem assim:

    {
    background:#222;
    width:100%;
    height:100px;
    margin-left: 10px;
    margin-right: 10px;
    display:block;
    }

Experimente isto:

width:auto;
margin-right:50px;