Duplicate Modules w Different CSS

[ankonaskiff17]

When reusing a module, in this case the default weather module, how do you apply unique CSS to each one separately?
I can see same thing arising with the default calendar module.

[sdetweil]

@ankonaskiff17 use the module identifier as the selector instead of the module name

u can look in the developer window, elements tab, to locate the ‘position’ and then the module

identifiers will be stable top down in config.js

[ankonaskiff17]

@sdetweil module_3_weather.module.weather and module_4_weather.module.weather would be what I would use to distinguish between the two in my css?

[sdetweil]

@ankonaskiff17 module_3_weather
is enough

with dot in front, as it’s a class

[ankonaskiff17]

@sdetweil This about duplicate modules and how to address them in config.js file. On my two calendar modules, how do I distinguish between the first and second modules in the config when module name is the same. The CSS name as you described above didn’t fly. The first module getRelative: 0,works as described but it is using the default getRelative: 6,in the second module

[sdetweil]

@ankonaskiff17 use the module identifier

look in the dev window, elements tab, and select the modules 1 at a time and see their identifier , use #id in custom.css

note if u add/remove modules before this one, its ID will change

[ankonaskiff17]

@sdetweil Are you saying to use that identifier in the config file too. I did that and it made the second module disappear.
I replaced module: 'calendar', with module: 'module_2_calendar',

This is the line in Developer Tools
<div id="module_2_calendar" class="module calendar calendar"

[sdetweil]

@ankonaskiff17 no. only in custom.css

identifier is created by mm

[sdetweil]

@ankonaskiff17 right, so #module_2_calendar

[ankonaskiff17]

@sdetweil You want me to start as new topic since it relates to config?