Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Css grid-columns got transpiled to different value

See original GitHub issue

Using less compiler, css grid property grid-columns got transpiled to different value. instead of 2 / -1, output value is -2, so that it displays different way.

Input file:

grid-column: 2 / -1;

Output of less preprocessor:

grid-column: -2;

Expected output:

grid-column: 2 / -1;

Less version 2.7.3.

This css feature is quite new, even I’ve just learned it recently here https://stackoverflow.com/questions/47319464/make-a-column-span-to-the-end-of-the-grid/47320149#47320149 but looks like transpilation is incorrect.

PS: is possible to temporary fix transpilation somehow ?

Issue Analytics

State:
Created 6 years ago
Comments:9 (6 by maintainers)

Top GitHub Comments

5reactions

matthew-deancommented, Nov 17, 2017

@jurosh Note you can also write: grid-column: ~"2 / -1"; but we’re hoping to fix this so neither of those things are required.

1reaction

seven-phases-maxcommented, Nov 16, 2017

Closing in favour of #1880.

Top Results From Across the Web

grid-template-columns - CSS: Cascading Style Sheets | MDN

The grid-template-columns CSS property defines the line names and track sizing functions of the grid columns.

CSS - Parcel

This is because url() references in custom properties are resolved from the location where the var() is used, not where the custom property...

grid-template-columns | CSS-Tricks

This is the default value. Using the none value means grid-template-columns generates no explicit grid tracks which, in turn, means that columns ...

Configuring quasar.config.js

Or you can use a global CSS file for SPA mode and another one for Cordova mode ... and not with the default...

Getting Started - BootstrapVue

For more straightforward sizing in CSS, the global box-sizing value is switched from content-box to border-box . This ensures padding does not affect...