简体繁体 English

在GitHub风格的Markdown中的表格旁边浮动图片

[英]Float an image next to a table in GitHub-flavored Markdown

原文 2018-01-27 13:32:21 5 2 html/ css/ markdown/ github-flavored-markdown

At the top of this README.md (raw code at the top of this page ), I am trying to float an image next to a Markdown table. 在此README.md （此页面顶部的原始代码）的顶部，我试图将图像浮动在Markdown表旁边。 My efforts with the float style property and align attribute in img have been unsuccessful. 我对img的float样式属性和align属性的尝试未成功。

2 个解决方案

As long as your document is hosted on GitHub you can't. 只要您的文档托管在GitHub上，您就不能这样做。

As documented in GitHub's Markup library, after the Markdown is converted to HTML, the... 如GitHub的标记库中所述，在将Markdown转换为HTML之后，...

HTML is sanitized, aggressively removing things that could harm you and your kin—such as script tags, inline-styles, and class or id attributes. 对HTML进行了清理，积极删除了可能损害您和您的亲属的东西，例如script标签，内联样式以及class或id属性。 See the sanitization filter for the full whitelist. 有关完整的白名单，请参阅清理过滤器。

In other words, anything you include in the Markdown to "style" your document ( style tags, inline-styles, etc.) will be stripped out by the sanitizer. 换句话说，您在Markdown中包含的用于为文档“样式化”的所有内容（ style标签，内联样式等）都将被清除程序删除。 If you want control over the look and styling of your documents, then you need to host them somewhere where you have complete control. 如果要控制文档的外观和样式，则需要将它们放在可以完全控制的位置。 GitHub is not that place. GitHub不是那个地方。

your table has width:100% and won't let any elements besides. 您的表格的width:100%并且不允许其他任何元素。 try changing its width to width :auto and display from block to display:inline-block . 尝试将其宽度更改为width :auto然后从块display:inline-block到display:inline-block 。 also, change the image container to display:inline-block 同样，将图像容器更改为display:inline-block