• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

Custom.css is not working

Scheduled Pinned Locked Moved Unsolved Troubleshooting
6 Posts 4 Posters 2.1k Views 4 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • C Offline
    cookblook
    last edited by Oct 9, 2019, 4:05 PM

    Hello,

    I am trying to change the width of the columns but with no success. I added the values to the custom.css but for some reason, it doesn’t work. When I go and change the CSS settings directly in the modules CSS file it works. Does anyone have an idea of what this can cause?

    S 1 Reply Last reply Oct 9, 2019, 4:29 PM Reply Quote 0
    • S Offline
      sdetweil @cookblook
      last edited by Oct 9, 2019, 4:29 PM

      @cookblook I don’t know the answer, but if you use the developers window (ctrl-shift-i), and select the elements tab, you can navigate thru the dom. and on any selected element you will see the style classes used, top to bottom.

      I was just working on this for a style not being applied… darned computers are VERY picky about the spelling!

      I just looked thru the MM code , and custom.css is loaded in the js/loader.js file

                              } else {
                                      // All modules loaded. Load custom.css
                                      // This is done after all the modules so we can
                                      // overwrite all the defined styles.
      
                                      loadFile(config.customCss, function() {
                                              // custom.css loaded. Start all modules.
                                              startModules();
                                      });
      

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      L 1 Reply Last reply Oct 9, 2019, 6:41 PM Reply Quote 0
      • B Offline
        buzzkc
        last edited by Oct 9, 2019, 6:34 PM

        It looks like the custom.css is the last css loaded in the header, so it should override any others. What specific changes have you added to the custom.css?

        Darren

        My Build: https://forum.magicmirror.builders/topic/11153/new-non-mirror

        1 Reply Last reply Reply Quote 0
        • L Offline
          lavolp3 Module Developer @sdetweil
          last edited by Oct 9, 2019, 6:41 PM

          @sdetweil Sam do you know if there is some tutorial available on what you just explained.
          Because I find it very precious as well and I would guess not nearly everyone knows about this possibility in the developer’s tab.

          If there’s nothing, I’m inclined to write a piece on that.

          How to troubleshoot modules
          MMM-soccer v2, MMM-AVStock

          L 1 Reply Last reply Oct 9, 2019, 6:47 PM Reply Quote 0
          • L Offline
            lavolp3 Module Developer @lavolp3
            last edited by Oct 9, 2019, 6:47 PM

            @lavolp3 @sdetweil
            Sorry, I could have just looked for it myself. Found it super fast.
            https://forum.magicmirror.builders/topic/6808/css-101-getting-started-with-css-and-understanding-how-css-works

            How to troubleshoot modules
            MMM-soccer v2, MMM-AVStock

            1 Reply Last reply Reply Quote 0
            • C Offline
              cookblook
              last edited by Oct 9, 2019, 10:18 PM

              I tried this one when I put it in the custom.css nothing happens. if I change it in the module CSS file it works.

              .MMM-DarkSkyForecast .module-content {
                width: 600px;
              }
              
              
              1 Reply Last reply Reply Quote 0
              • 1 / 1
              1 / 1
              • First post
                1/6
                Last post
              Enjoying MagicMirror? Please consider a donation!
              MagicMirror created by Michael Teeuw.
              Forum managed by Sam, technical setup by Karsten.
              This forum is using NodeBB as its core | Contributors
              Contact | Privacy Policy