Image alignement

noursbleu's Avatar

noursbleu

29 Nov, 2020 10:10 AM

Hi !
One an specify image alignement, passing for example ![legend](images/myimage.png width="3cm" align="right")
-> If this is just an image (inline mode) all is ok because this is rendered via: html <img src="images/myimage.png" align="right" style="width:2cm;"/> <pre><code>-&gt; If the image is the only thing specified in paragraph, mmd transform it to a figure. And then, alignement is not working, because this is translated into:html <figure> <img src="images/myimage.png" align="right" style="width:2cm;"/> </figure> If align="right" or align="left" is specified, this could be translated into this for a better behavior:
```html

I made an GUI editor for mmd and I wrote a parser to alter this, and it works like a charm:
-> no align specified : use css specs
-> align right or left, pass to figure tag via float style.


What do you think about it ? Thank you ! Best regards, Nicolas
  1. 1 Posted by noursbleu on 29 Nov, 2020 10:14 AM

    noursbleu's Avatar

    Hi !
    One an specify image alignement, passing for example ![legend](images/myimage.png width="3cm" align="right")

    -> If this is just an image (inline mode) all is ok because this is rendered via:

     <img src="images/myimage.png" align="right" style="width:2cm;"/>
    
    If the image is the only thing specified in paragraph, mmd transform it to a figure. And then, alignement is not working, because this is translated into:
    <figure> <img src="images/myimage.png" align="right" style="width:2cm;"/> </figure>
    
    If align="right" or align="left" is specified, this could be translated into this for a better behavior:
    <figure style="float:right;"> <img src="images/myimage.png" style="width:2cm;"/> </figure>
    
    
    
  2. Support Staff 2 Posted by fletcher on 29 Nov, 2020 02:15 PM

    fletcher's Avatar

    I'll consider it in the future when I have more time, but I suspect this is getting too deep in the weeds to be a core feature of MultiMarkdown. It is likely better handled with raw HTML.

    One of the design principles of MultiMarkdown is to handle the majority of functionality that the majority of users need. Not sure this qualifies.

    You could also look at using CSS to handle this as well.

    Thanks!

    Fletcher

  3. 3 Posted by noursbleu on 02 Dec, 2020 02:25 PM

    noursbleu's Avatar

    Hi.

    Thank you for your answer and for thinking about it.
    It would add flexibility and it would be almost complete for a lot of things.
    Big last thing would be vertical merging of cells in a tab, and your app could be used
    in scientific world.

    Thank you !

  4. 4 Posted by Dave Hein on 17 Dec, 2020 03:23 PM

    Dave Hein's Avatar

    Fletcher, if MMD is generating a figure element then the attributes specified in the markdown should be added to the figure element and not the img element within the figure.

    It's not possible to properly style the image/figure if that is not done.

    Nowadays, HTML5 document styling is done by assigning classes (via the "class" attribute) to HTML elements and using those classes to assign CSS styles from a style sheet. This keeps the HTML clean (no style blocks or verbose style attributes) and allows the powerful CSS selection capability to fully control document styling in a flexible and efficient way.

    If I specify a "class" attribute in the markdown, and that class attribute is assigned to the img element rather than the containing figure element, then I have no way of using CSS to style some figures differently that others. And the img elements in every figure are constraint to however the figure element is styled globally.

    If the "class" attribute gets assigned to the figure then I can use CSS to selectively style both the figure element and the contained img element, using different styles for different combinations of classes.

    I think that one change would resolve most of the headaches around this issue and would help avoid embedding HTML in the markdown.

  5. 5 Posted by adrian on 31 May, 2025 02:37 PM

    adrian's Avatar

    If it helps, I too have been interested for a long time in aligning (left, right, center, or justified) images and MMD-tables in the Composer for macOS.
    Thank you.

  6. Support Staff 6 Posted by fletcher on 31 May, 2025 08:29 PM

    fletcher's Avatar

    I have written the MultiMarkdown->HTML portion of MultiMarkdown v 7, so it's a good time to consider possible changes.

    I'm open to changing the way figure/img's work, but I do want to make sure that things change once, and change in the best possible way (remembering that the goal is to do the right thing for most users most of the time by default, not to allow for every conceivable thing that anyone might want to do.)

    1. What sorts of use cases would you want to apply different classes to specific figures in a document, rather than to the img within the figure? Since the only time MMD generates figure elements is around an img (with or without a caption), it would seem that one would generally want these to be styled consistently?

    2. Adrian -- what specifically do you mean in terms of aligning images and tables? Any examples?

    Thanks!

    Fletcher

  7. 7 Posted by adrian on 08 Jun, 2025 06:23 PM

    adrian's Avatar

    Dear Fletcher,

    Generally I make regular use of tables in longer texts, always as a way of summing up after a chapter or section heading, what is the gist of what follows.
    I go back myself while writing to that introductory table to remain focussed, and I have the impression that such tables are useful also for readers.

    I have also otherwise tables to clarify relations, which seem to be easier understood, than other kinds of graphic representations of «permanent tensions» and «permanent similarities» on more concrete or abstract levels.

    To answer explicitly your question:
    By aligning I clearly do not mean inside a table cell (or more precisely, table column) which is perfectly fine as it is now for my needs.I mean the alignment of the whole table in the page, that is:
    left
    centre
    right
    justified.

    Also having the choice of having captions with numbering in, say, A.mmd and being able to suppress either the numbering, or the captions, or both, when A.mmd is embedded in B.mmd would be great.
    The numbering could be document-wide, or of the form Chapter#.Table#. or Chapter#.Section#.Table#.

    The inhibitions of the largest container document would prevail in the Marked2 rendering.
    Surely the question is: what happens when A.mmd has both numbering and text captions, B.mmd inhibits the numbering and the text captions, C.mmd inhibits only the numbering,
    in the case when A.mmd is embedded in B.mmd and the latter is embedded in C.mmd.
    If only the rendering is inhibited, but not the I do not see any problem in the Marked2 rendering.
    What do you think, and what is Brett’s opinion on this?

    Thank you, Fletcher, for all you do for our community, and please pass on my thanks to Brett too,
    All the best,
    Adrian

Reply to this discussion

Internal reply

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

Attaching KB article:

»

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

Generic

? 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

Recent Discussions

08 Jun, 2025 06:23 PM
08 Jun, 2025 05:15 PM
08 Mar, 2025 02:38 AM
09 Jan, 2025 02:24 AM
11 Dec, 2022 07:57 PM

Recent Articles