1

I made an edit to this question to convert the images from links to tags so that a reader wouldn't have to click on each one. In the original post all of the images were correctly oriented when you clicked on them (the top of the image was reasonable). As tags they are all landscape, even the ones that had been portrait before. Is there a way to fix this? I tried to add:

style="transform: rotate(90deg)"

Since I'm using Safari, I also tried:

style="-webkit-transform: rotate(90deg)"

But both got ignored.

Any ideas why the images aren't show up in the same orientation as when they were links? Any suggestions for how to fix it?

2
  • In the future, these types of questions should go to meta.se, not meta.bicycles.se. These are features of the whole SE system, not specific to bicycles.se.
    – Batman
    Commented Aug 11, 2015 at 18:07
  • Oops, thanks for that!
    – dlu
    Commented Aug 11, 2015 at 18:09

1 Answer 1

Reset to default
1

It's the EXIF header data most likely.

The header data of the first image is:

$ ./jhead Original.JPG 
File name    : Original.JPG
File size    : 1282958 bytes
File date    : 2015:08:11 11:34:59
Camera make  : Apple
Camera model : iPhone 6
Date/Time    : 2015:08:11 21:26:22
Resolution   : 3264 x 2448
Orientation  : rotate 90
Flash used   : No
Focal length :  4.2mm  (35mm equivalent: 29mm)
Exposure time: 0.067 s  (1/15)
Aperture     : f/2.2
ISO equiv.   : 320
Whitebalance : Auto
Metering Mode: spot
Exposure     : program (auto)
GPS Latitude : N 35d 40m 44.46s
GPS Longitude: E 139d 40m 12.65s
GPS Altitude :  65.35m
JPEG Quality : 92

Note the presence of "Orientation: rotate 90".

Imgur handles the rotation properly (open the linked image in a new browser and it rotates correctly), but stackexchange doesn't. Note that stackexchange strips most of the tags you can pass in html.

7
  • Yes, I figured it was stripping the style attribute. Is this worth turning into a feature request for SE?
    – dlu
    Commented Aug 11, 2015 at 18:10
  • I don't think its stripping it, but it can be done on client side with CSS: w3schools.com/cssref
    – Batman
    Commented Aug 11, 2015 at 18:42
  • I meant the style attribute I put in with the edit. I tried this: <img src="blah" style="-webkit-transform: rotate(90deg);"> and the transform didn't happen (I was looking at it in Safari).
    – dlu
    Commented Aug 11, 2015 at 20:01
  • You may as well throw it in as a feature request, since it may be a simple css modification they can do.
    – Batman
    Commented Aug 11, 2015 at 20:08
  • OK, I'll do that. I finally got serious and took a look at the actual CSS that SE puts out and the style attribute did get stripped.
    – dlu
    Commented Aug 11, 2015 at 20:09
  • Adding attributes that are Apple-centric is mostly non-productive.
    – andy256
    Commented Aug 11, 2015 at 22:03
  • 1
    @andy256, I used the "Apple-centric" version to make sure that the problem wasn't my browser (Safari). I was trying to figure out if the approach worked. Turns out the right thing to do is to create a link to the image using imgur. Then it "just works."
    – dlu
    Commented Aug 11, 2015 at 22:13

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .