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

Calendar module width limit

Scheduled Pinned Locked Moved Bug Hunt
3 Posts 2 Posters 2.5k Views 2 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.
  • Y Offline
    yomm
    last edited by Feb 24, 2018, 10:19 PM

    Hello all !

    My installation is on a rpi3. My mirror/screen is a 20’ with a 1650*1050 resolution. MM² and modules are up to date.

    I use Calendar module for a while, his position on the mirror is top_left.

    Recently I add some other calendars with some long name meetings.
    I got a strange behavior : the calendar module expands from the left of the screen to the middle. This happens when long name event are schedule.
    I tried MyCalendar module which is based on Calendar. Same thing happens.

    So is there a way to limit the width of the calendar module to prevent it spreading on the half of the screen ?

    Thanks for your help !

    N 1 Reply Last reply Feb 24, 2018, 10:53 PM Reply Quote 0
    • N Offline
      ninjabreadman @yomm
      last edited by ninjabreadman Feb 24, 2018, 11:07 PM Feb 24, 2018, 10:53 PM

      @yomm There are different regions, but most will expand to try to accommodate your content/text.

      See this post moments ago here, where I give advice on how to limit the width. In your case, I believe the selector is .module.calendar.

      You can also use the CSS word-wrap property to make your events break to the next line, or text-overflow to display an ellipsis when they’re cut off.

      Problem with config or JavaScript? Copy/paste it into JSHint.
      Check out the detailed walkthroughs on install, config, modules, etc.

      1 Reply Last reply Reply Quote 0
      • Y Offline
        yomm
        last edited by yomm Feb 25, 2018, 1:37 AM Feb 25, 2018, 12:41 AM

        Thank you ninjjabreadman !

        Exactly what I need !

        .module.MMM-MyCalendar {
        max-width: 300px; 
        }
        
        1 Reply Last reply Reply Quote 0
        • 1 / 1
        1 / 1
        • First post
          1/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