I would like to center the image at the top of the topic starter which doubles as my blog for people to comment on. Or better yet, make the photo expand to the width of the box. What would be the code for that? Thanks. 
1 个赞
You can align an image with HTML:
<div align="center">
<img src='//assets-meta-cdck-prod-meta.s3.dualstack.us-west-1.amazonaws.com/original/3X/3/5/35b818325e1ea3cd9ef837696e6fe889447d8d5f.jpg'>
</div>
That looks like this:
10 个赞
Would it make sense to have uploaded images centered by default in Discourse? Posts look nicer this way, and probably lazy users would prefer this setting but we are… just lazy to add the HTML manually.
Users with other needs could still add the HTML.
5 个赞
I prefer images not being centered by default, they should adjust the way the reader prefers to read text (left to right, or vice versa). But that’s really always a personal flavor.
Markdown itself doesn’t have such capabilities, you’ll always need to use HTML for such things. Similar thing for showing a fixed scaled image size.
It might be a nice addition to add alignment icons into the editor, similar to what Wordpress allows, and just do the HTML magic there.
3 个赞
If the images are not wide enough they will stack horizontally like so:
If you’re fine with losing this, then you can automatically center all images in posts using CSS.
.lightbox-wrapper {
display: block;
text-align: center;
}
p>img:not(.emoji){
display: block;
margin: 0 auto;
}
The results would look like this:
14 个赞
I am definitely using that. Thanks III !
1 个赞
As discussed here:
The code needs to be modified to exclude emojis.
I edited the code in the previous post to reflect that change.
The rest of the post still applies.
5 个赞
It’s now a wiki, feel free to update it.
6 个赞
I have an image I uploaded to the site that I’d like to reuse and center but it’s not working for me.
This works:
How would I center this image using the syntax shared above?
Thanks!
If you’re willing to use the BBCode plugin (and understand its risks & benefits), it allows for anyone to center images using only the editor.
你不需要 bbcode 插件，只需使用一些 HTML 即可。
<div align="center">
</div>
请注意，由于 HTML 和 Markdown 混合使用，必须保留空行。如果没有空行，你将得到居中的文本，而不是图片。
20 个赞
为什么这对我行不通？编辑器中哪里可以找到“代码”按钮来编写一些 HTML？
谢谢。
您使用键盘按键输入。没有“代码”按钮。
2 个赞
是的，我试过，但没用。我再试一次。
谢谢。
1 个赞
当你说“不工作”时，具体得到了什么结果？有没有可能是居中显示的文本而不是图片？
如果是这样，请确保像我在上面的示例中那样包含一个空行。我已经添加了一条说明来强调这一点。
2 个赞
非常感谢！我知道代码是正确的，但无法得到预期的结果。感谢提醒和解释 @jomaxro！
4 个赞
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.