How can I optimize blog post image dimensions for mobile (any orientation)

[newedgemarketing]

Hi all,

I'm using eleven40 pro theme which has a post width size of 810px. For most of my posts I use a half width (405px) right aligned image.

I've just noticed that whilst the post and images look great portrait on a mobile (currently iphone) as they fill the whole width of the screen.

They don't look great when i turn my phone landscape as they only fill about 3 quarters of the screen and i end up with maybe one word next to the image which looks kid of messy.

I know i can get around this by using full width images but i don't always want to do that because depending upon the image it can be shrunk so much on mobile that you cant read any text in that image.

Is there anyway I can optimise my images so that i can use a half width image in my blog post and then have it fit full width of a mobile whatever orientation it is?

http://newedgemarketing.com.au/steps-to-creating-competitive-advantage/?preview=true&preview_id=924&preview_nonce=b00031f404

[Lauren Gaige]

Hi there,

You could do a couple things here:

1. You could make your images just a bit bigger so it fills the widget of the landscape view on an iphone.

2. Or.. since most of your images are assigned the class alignright, you can force the alignright class to be like the aligncenter class under the media queries for that screen size.

So you could add:

.alignright {
float: none;
margin: 0 auto;
}

under the @media only screen and (max-width: 767px) section.

Hope this helps!

---

Lauren
http://www.restored316designs.com

[eadev19entsp]

the auto usually works

[Author]

Posts