Myword Style

loeffler's Avatar


14 Feb, 2013 03:01 PM emphasizes the text and makes markdown a subdued gray. it is based on Byword.css file by Brett Terpstra for

Myword Style

  1. 1 Posted by tsvoronos on 09 Feb, 2015 06:36 PM

    tsvoronos's Avatar

    I apologize for the very simple question, but is there a way to tweak this so that images autofit into the preview window? I can't seem to figure out how to make this happen.

  2. 2 Posted by loeffler on 18 Feb, 2015 07:17 PM

    loeffler's Avatar

    I thought it was going to be easy but it's not. I am working on it.

  3. Support Staff 3 Posted by Fletcher on 18 Feb, 2015 08:25 PM

    Fletcher's Avatar

    It's not hard. The CSS just needs to include

    img {width:100%}

    and possibly:

    figure {width:100%}

    depending on exactly what you want and your other CSS.

  4. Fletcher closed this discussion on 18 Feb, 2015 08:25 PM.

  5. tsvoronos re-opened this discussion on 18 Feb, 2015 08:30 PM

  6. 4 Posted by tsvoronos on 18 Feb, 2015 08:30 PM

    tsvoronos's Avatar

    The problem is the #wrapper references in your css which MMD composer rejects.

    Sent from my iPhone

  7. Support Staff 5 Posted by Fletcher on 18 Feb, 2015 09:19 PM

    Fletcher's Avatar

    Composer doesn't "reject" them. Unless you put in a

    there's nothing for them to operate on.

    My point still stands -- if you want images to fill the preview window, use what I wrote above. It works (I just did it).

    If you are using CSS that adds in a bunch of stuff that breaks things, I can't help that. Clean up the CSS and remove the extraneous stuff. ;)

    But when I tested just now, it works. Including with the Myword style in 2.8 and converted to a theme for 3.0.

  8. 6 Posted by tsvoronos on 18 Feb, 2015 09:22 PM

    tsvoronos's Avatar

    Got it, sorry to both for the misinformation!


  9. Support Staff 7 Posted by Fletcher on 18 Feb, 2015 09:36 PM

    Fletcher's Avatar

    (oops the <div class="wrapper"> got filtered out from my last message.

  10. 8 Posted by loeffler on 20 Feb, 2015 01:55 AM

    loeffler's Avatar


    I have reviewed the and have made some modifications. The CSS now scales large images and properly centers them. There were a couple of things I needed to change. This is an example HTML file <>. It accesses a large image file that is rescaled as you change the width of the window. It also describes the changes I had to make to the CSS in the style file.

    The new file <> works but WARNING - is consumes a lot of resources if there is a live preview in MultiMarkdown Composer of a large image. If you modify the MultiMarkdown file <> used for testing you'll see just how slow the refresh is because it appears the large image is resized for display with each new character.

    I tested the HTML file on Safari and Chromium. I also tried to display in Marked 2 and inspected the HTML produced which has, as you stated, the <div class="wrapped"> ...</div> is inserted.

    My normal mode of operation is create a scaled down image file that I display on the page and link it to the full size image.


  11. Support Staff 9 Posted by Fletcher on 20 Feb, 2015 12:59 PM

    Fletcher's Avatar


    Thanks for the description.

    And yes, a long/large/complex preview will require more resources, even without this theme. Composer v3 works in a slightly different way to try and further minimize the impact of complex previews on the editing pane's responsiveness. But at some point, you need a faster computer if you want it to do more work in less time.

    In the case of documents like this, my recommendation is to set the preview to only refresh when the document is saved. This will improve the responsiveness while typing between saves.

    The other thing that helps HTML in general is to use width and height attributes for images. This allows the page to be properly laid out, even before the image is loaded. I realize that this is not compatible with the concept of wanting your image to adjust width to fit the available preview.

    This is a perfect example of why "one size does not fit all." The "proper" theme for a given document can depend on many factors, which is why Composer gives you the tools you need to adjust it's behavior as needed. ;)

  12. 10 Posted by Danielle on 24 Feb, 2015 12:32 PM

    Danielle's Avatar

    Hi, Do you know if i can customize this template so it's media wiki compliant. in that:

    = heading 1= == heading 2 == * bullet

    numbered list

    2nd item

    ; term for def list : definition

    '''bolds text''' ''italicizes ''

    thanks for your time.
    Best, Danielle

  13. Support Staff 11 Posted by Fletcher on 24 Feb, 2015 12:41 PM

    Fletcher's Avatar

    1) MultiMarkdown Composer is designed to handle, strange as it may seem, MultiMarkdown (and "regular" Markdown).

    The MediaWiki syntax is not Markdown.

    2) These style sheets (now themes) are designed for modifying the appearance of the MultiMarkdown Composer editor. They don't change the underlying behavior of the application, just the appearance.

    Pandoc seems to have some MediaWiki support. It may be possible to interconvert between Markdown (with some extensions) and MediaWiki syntax. Though it's not quite clear to me why that would be particularly useful.

  14. 12 Posted by loeffler on 25 Feb, 2015 05:14 PM

    loeffler's Avatar

    This is the newest for MultiMarkdown Composer 2. It is modeled on Brett's Byword css file for Marked. It has been modified to properly resize large images to fit in the preview's width.


Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Already uploaded files

  • 7.91 KB

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac