• 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.

CSS Help

Scheduled Pinned Locked Moved Custom CSS
18 Posts 3 Posters 2.8k Views 3 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.
  • S Offline
    sdetweil @BKeyport
    last edited by Aug 1, 2022, 11:04 AM

    @BKeyport when there is no space between classes it means has all

    but this is split over 2 tags
    div .region.top.bar
    div .container

    Sam

    How to add modules

    learning how to use browser developers window for css changes

    B 1 Reply Last reply Aug 1, 2022, 8:04 PM Reply Quote 0
    • B Offline
      BKeyport Module Developer @sdetweil
      last edited by Aug 1, 2022, 8:04 PM

      @sdetweil So, how would I get down to container, and restrict it to within the top bar?

      The "E" in "Javascript" stands for "Easy"

      S 1 Reply Last reply Aug 1, 2022, 8:31 PM Reply Quote 0
      • S Offline
        sdetweil @BKeyport
        last edited by Aug 1, 2022, 8:31 PM

        @BKeyport in css you can’t as it selects all

        using code you can, cause u can change one element

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • S Offline
          shin10 Module Developer
          last edited by shin10 Aug 1, 2022, 8:59 PM Aug 1, 2022, 8:57 PM

          Just use

          .region.top.bar .module {
              display: inline-block;
          }
          

          or even better, explicitly the modules you want in one line (to avoid notifications shifting everything to the left in case they pop up)

          .MMM-FlipClock, .MMM-Worldclock {
              display: inline-block;
          }
          

          (*oops - edited)

          B 1 Reply Last reply Aug 1, 2022, 9:13 PM Reply Quote 1
          • B Offline
            BKeyport Module Developer @shin10
            last edited by Aug 1, 2022, 9:13 PM

            @shin10 2nd option is near perfect! Thanks! (changed it to inline-flex, and it lines up correct)

            The "E" in "Javascript" stands for "Easy"

            S 1 Reply Last reply Aug 1, 2022, 9:50 PM Reply Quote 0
            • S Offline
              sdetweil @BKeyport
              last edited by Aug 1, 2022, 9:50 PM

              @BKeyport but you asked to modify top_bar, not your module…

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              B 1 Reply Last reply Aug 1, 2022, 9:51 PM Reply Quote 0
              • B Offline
                BKeyport Module Developer @sdetweil
                last edited by Aug 1, 2022, 9:51 PM

                @sdetweil True, because I didn’t know the solution was to specify per-module.

                😉

                The "E" in "Javascript" stands for "Easy"

                S 1 Reply Last reply Aug 1, 2022, 9:52 PM Reply Quote 0
                • S Offline
                  sdetweil @BKeyport
                  last edited by Aug 1, 2022, 9:52 PM

                  @BKeyport ah , requirements… lol

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  B 1 Reply Last reply Aug 1, 2022, 9:53 PM Reply Quote 0
                  • B Offline
                    BKeyport Module Developer @sdetweil
                    last edited by Aug 1, 2022, 9:53 PM

                    Devil in the details, again. :)

                    The "E" in "Javascript" stands for "Easy"

                    1 Reply Last reply Reply Quote 0
                    • 1
                    • 2
                    • 2 / 2
                    2 / 2
                    • First post
                      14/18
                      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