Hey Community,
For an App I’m building I’m using a toggleButton as a darkmode switch. For this button I copied a piece of CSS from another App to a global CSS file in my App, to add icons to the left and right of the button.
The CSS is defined as:
/* 1st icon with child-selector */ div#darkmode_toggle_Container label:nth-child(1):after {background-image: url(data:image/png;base64, ... [long base64 code]
/* 2nd icon with child-selector */ div#darkmode_toggle_Container label:nth-child(3):after {background-image: url(data:image/png;base64, ... [long base64 code]
Now I want to use this button with those icons in two different layouts, so in both layouts I have a “darkmode_toggle_Container”, which both refer to the same element. Both containers are defined exactly the same, with exactly the same pixel space allocated to them. The icons, however, are only displayed on one of the pages, the other one has just the normal toggle button.
Is it generally not possible to use icons defined like this in multiple places? Does it work differently? Or is it more likely that I have made an error somewhere else?