MitchW
MitchW

@Mtt Hi, Matt! On the Tiny theme, is it possible to run images smaller than full width? For example, sometimes I just want to run an image at 200 pixels. And is it possible to float images—embed them in text, flush-left or flush right? Thanks! Great work on the theme and plugins.

|
Embed
Progress spinner
Mtt
Mtt

@MitchW Yes, it's possible. But due to how M.b handles images, it's a little extra work.

  1. Upload the image(s) using the Uploads page in M.b.
  2. Click Copy HTML of image
  3. Paste that into the post
  4. Edit what you pasted by inserting style="insert-styles" into the html.

For example: <img src="link_here" style="width:200px;">

|
Embed
Progress spinner
Mtt
Mtt

@MitchW Additionally, if you find yourself re-using a specific styling, you could add that in custom css like this:

.float-img {
width: 200px;
float: left;
padding: 5px;
border-radius: 0;
etc
}

Then you could just add class="float-img" whenever you wanted that styling. Pay attention to mobile devices if going this route.

|
Embed
Progress spinner
MitchW
MitchW

@Mtt Thanks!

|
Embed
Progress spinner
MitchW
MitchW

@Mtt Will this work if I want to align the image right?

<img src="image.jpg" style="width:200px;align=right" alt="alt text" />

|
Embed
Progress spinner
Mtt
Mtt

@MitchW Yes, for the width part. However, the align part with images doesn't work like you might think. You might consider adding float: right;. That'll move it right and make text wrap around it. You'll also probably want to add something like padding: 5px 0 5px 5px; to give the image a little breathing room too.

If you're only wanting to align it right and not have text wrap, try this (I'm doing it from a phone, so not putting everything through proper paces right now):

div style="text-align: right;"
<img src="image.jpg" style="width: 200px;">
/div

(You'll need brackets around the div elements but M.b doesn't display the code right if I put them in.)

|
Embed
Progress spinner
MitchW
MitchW

@Mtt Thanks again! I may want to have text wrap but I'll take this up another day.

|
Embed
Progress spinner