• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Is it possible to use variables in CSS?

Engaged ,
Nov 28, 2018 Nov 28, 2018

Copy link to clipboard

Copied

I know you can define multiple classes at once, by separating them with commas... but can you do the opposite?

Something like...

$stringA = 500px

.class1 { min-width: $stringA;px }

.class2 { max-width: $stringA;px }

This isn't anything I'm trying to do specifically, let's not focus too much on the example; I'm just trying to find out if there's a way to define a variable in one location and call it in multiple other locations (with or without the help of php).

Thanks!

Views

904

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Mentor , Nov 28, 2018 Nov 28, 2018

Votes

Translate

Translate
Mentor ,
Nov 28, 2018 Nov 28, 2018

Copy link to clipboard

Copied

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 29, 2018 Nov 29, 2018

Copy link to clipboard

Copied

ALsp​ provided a simple solution. For reinforcement, take a look at this simple demo video:

CSS Variables without Sass? Learn how to use CSS Variables (Tutorial) - YouTube

Hope this helps!
Make sure to press "✔ Correct Answer" on this post if this answers your question. Happy Creating!
Anissa • @anissat

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 29, 2018 Nov 29, 2018

Copy link to clipboard

Copied

CSS Variables are awesome, when they work, and a lot of unnecessarily duplicated code, when they don't.

Since everything needs to be written out normally, as the fallback for most Microsoft browsers, css variables aren't quite worth using yet in my opinion. However, they are definitely worth knowing for the time when IE usage drops to near zero for your regularly updated sites.

CSS Variables

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Mentor ,
Nov 29, 2018 Nov 29, 2018

Copy link to clipboard

Copied

It truly is amazing how these threads seem to have a life of their own

I can cite ways in which they can be used now, in limited roles, even as a self-healing fallback for other things IE doesn't support. In fact, almost like an @supports rule. But I think the original poster might be overwhelmed,

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Nov 29, 2018 Nov 29, 2018

Copy link to clipboard

Copied

ALsp  wrote

It truly is amazing how these threads seem to have a life of their own

And just to prove it -

No version of Dw supports the use of css variables, (doesn't even support srcset/picture, and those were a w3c recommendation status over 2 years ago).

So use, but expect Dw to flag as error.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Mentor ,
Nov 29, 2018 Nov 29, 2018

Copy link to clipboard

Copied

LATEST

pziecina  wrote

ALsp   wrote

It truly is amazing how these threads seem to have a life of their own

And just to prove it -

I'll see you and raise you 6 bits

We sell an extension that does srcset in Dreamweaver - from Dreamweaver MX to Dreamweaver 19. We also have extensions that restore Server Side Include and Design Time CSS to Dreamweaver CC versions.

It's on our plan to do a CSS variable tool in late 2019 or early 2020.

I think one of the things all Dreamweaver users need to understand is when to ignore Dreamweaver's error messages.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines