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.

    Table width, how do I increase it?

    Scheduled Pinned Locked Moved Troubleshooting
    2 Posts 2 Posters 355 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.
    • J Offline
      jasondreher
      last edited by jasondreher

      How do I increase the text width on my module? I want to show the album art and info, but the info gets broken up into multiple lines.

      Below is part of my code and a picture of what happens. The “meta_html” is the table I want to change

      	getDom: function() {
      		var wrapper = document.createElement("div");
      		var albumart_html = '';
      		var meta_html = '';
      		var html = "<div class='player bright scrobbler-"+this.config.alignment+"'>";
      
      		albumart_html += "<div class='album-art-container'><div class='album-art'><img src='"+ this.image +"' width='150'></div></div>";
      		meta_html += "<div class='meta'><table class='small'><tr class='track-name bright'><td>"+this.title+"</td></tr><tr class='artist-name'><td>"+this.artist +"</td></tr><tr class='album-name dimmed'><td>"+this.album+"</td></tr></table></div>";
      		html += albumart_html;
      		html += meta_html;
      		
      		html += "</div>";
      		wrapper.innerHTML = html;
      
      		//var wrapper = document.createElement("div");
      		//wrapper.innerHTML = this.config.text;
      		return wrapper;
      
      		
      	},
      

      9d726ef9-08f2-4773-9b2a-7e51dbcbfdae-image.png

      1 Reply Last reply Reply Quote 0
      • BKeyportB Offline
        BKeyport Module Developer
        last edited by

        I set my table with a variable width using a percentage for my module.

        https://www.w3schools.com/tags/tag_table.asp is a good place to start, and you can then adjust things like the <td> tag as needed.

        jsfiddle.net is a good place to play, as well, FYI. You can build your JS up and get it working, then all ya gotta do is translate to MM spec.

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

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