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

Column width change help

Scheduled Pinned Locked Moved Custom CSS
3 Posts 3 Posters 1.2k 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.
  • C Offline
    cookblook
    last edited by Oct 8, 2019, 12:39 PM

    Hello,

    I am trying to change the width of the columns but for some reason, I can’t make it work. I already tried these custom css settings. But no matter what I put in it does not change the width. I also attached a picture of the screen.

    .region.center .module-content,
    .region.center .module-content header {
      text-align: left;
      max-width: 1050px;
      min-width: 1050px;
    }
    
    region.top.left {
        width: 1000px;
    }
    
    .region.top.center {
        width: 1000px;
    }
    
    .region.top.right {
        width: 1000px;
    
    .region.bottom.right {
        width: 1000px;
    }
    
    .MMM-TAF {
      Width: 600px;
    }
    
    .MMM-DarkSkyForecast .module-content {
      width: 600px;
    }
    
    

    0_1570538345236_2019-10-08_08-32-52.jpg

    1 Reply Last reply Reply Quote 0
    • M Offline
      mlcampbe
      last edited by Oct 9, 2019, 12:33 PM

      Do you have ANY settings in the custom.css file that are working? In my case I had to explicitly add the line

      customCss: “css/custom.css”,

      to the config.sh file. Once I did that then items in the file started to take affect. I have not tried absolute values for the width but I have used the following successfully.

      .region.top.right {
      width: 23%;
      }

      .region.top.left {
      width: 78%;
      }

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

        @mlcampbe custom.css has been force loaded as the last css file since 2.6 as I recall…

        Sam

        How to add modules

        learning how to use browser developers window for css changes

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