Flow text around an image in (GitHub) Markdown

Solution 1:

The align="right" (or left) attribute works in GitHub Markdown:

<img align="right" src="doc/subpagelist.png">

Solution 2:

It works for me (only for jekyll, it does not work for Github markdown): Put the code below in your content markdown (I have put it on the first line for better organization)


    <style type="text/css">
    .image-left {
      display: block;
      margin-left: auto;
      margin-right: auto;
      float: right;
    }
    </style>

And refers to your image as follows: [![Proguard](./proguard-snippets.png)](http://www.thiengo.com.br/proguard-android){: .image-left } Your Text comes here...

Note the .image-left class besides the image url.

The final results are here: Movies of the Year jekyll github page

Solution 3:

In markdown you can add extra attributes to tags. For instance I use this for what you intend to do:

![Some Title](http://placehold.it/image.jpeg){:style="float: right;margin-right: 7px;margin-top: 7px;"}

Solution 4:

align="left" works fine. To break the alignment again, use a <br clear="left"/> (or <br clear="right"/>) tag:

<img src="/path/to/image.png" align="left" width="200px"/>
some text floating around the image

<br clear="left"/>

A "newline". This text doesn't float anymore, is left-aligned.