WordPress.org

Make WordPress Core

Opened 4 years ago

Closed 3 years ago

#18775 closed defect (bug) (fixed)

no picture reduction

Reported by: micha15295 Owned by:
Milestone: 3.3 Priority: normal
Severity: major Version: 3.2.1
Component: Bundled Theme Keywords: has-patch
Focuses: Cc:

Description

Afterwards reduced pictures (e.g., 90%, 80%, etc.) are indicated only in actual size.
Example for it on http://www.wdost.de/wp/

Attachments (1)

18775.patch (463 bytes) - added by SergeyBiryukov 4 years ago.

Download all attachments as: .zip

Change History (13)

comment:1 follow-up: @dd324 years ago

  • Component changed from General to Bundled Theme
  • Keywords needs-patch added

When inserting full sized images through TinyMCE, TwentyEleven's CSS overrides the %age width(specified via exact pixel dimensions in the <img />), causing the resulting image to be displayed at full width rather than scaled.

The CSS rule this is coming from is this:

img.size-full { 
max-width: 97.5%;
width: auto;
 }

I can't see any extra generated classes which can be used to indicate that the image has been scaled. One alternative would be to define an inline style on the <img /> tag that duplicates the html attributes height/width..

comment:2 @micha152954 years ago

As an additional info I can say that this bug came with the version 3.2.1, until this version there was not any problem with scale down of images.

comment:3 @dd324 years ago

I can say that this bug came with the version 3.2.1

It's theme specific, It applies to the TwentyEleven theme at least, and probably a few others out there that are using responsive designs.

@SergeyBiryukov4 years ago

comment:4 in reply to: ↑ 1 @SergeyBiryukov4 years ago

  • Keywords has-patch added; needs-patch removed

Since width: auto; was a specific fix for IE 8, we can probably limit it to IE 8 using the id="ie8" attribute already added by conditional comments in header.php.

This would allow other browsers to display the correct width.

Tested in IE 7, IE 8 (still displays full width), IE 9, Firefox 7, Chrome 14, Opera 11.51.

comment:5 follow-up: @micha152954 years ago

I believe you're on the wrong way, the style.css seem to be not the cause of the problem.
My Wordpress-installation on the example URL was made for testing only, but first I saw the bug at my main blog where I use the theme "Rustic".
I had a look into the style.css of the rustic theme, but there's not any line with the content of "img.size-full...and so on".
So I think the bug seem to be independent from the used theme.

comment:6 in reply to: ↑ 5 @SergeyBiryukov4 years ago

Replying to micha15295:

first I saw the bug at my main blog where I use the theme "Rustic".
I had a look into the style.css of the rustic theme, but there's not any line with the content of "img.size-full...and so on".

There's width: auto; for #content img, which has the same effect:
http://themes.trac.wordpress.org/browser/rustic/1.1/style.css#L840

So it's still theme-specific.

comment:7 @micha152954 years ago

I does'nt know if I understand it correct - does it mean the core of version 3.2.1 is o.k. but there's suddenly a bug in hundreds of themes? - Sorry, but unbelieveable for me!
Just I made a test with your patch - it works perfect in Opera 10.51 and Firefox 6.0.2, but in IE8 (not tested yet in IE9) it does'nt take any effect.
Please think about it, the problem came with the update to version 3.2.1, in this time there was only a change in WP for itself, the versions of the themes are the same before and after.
So you can't have a look for the cause in theme's style.css, you have to find the bug in WP.
The bug is still open!

comment:8 @dd324 years ago

does it mean the core of version 3.2.1 is o.k. but there's suddenly a bug in hundreds of themes?

Sorry, but yes, that's exactly what it means. the output from WordPress is correct, It's the same as it's always been, the problem is themes css styling the images differently. You can Activate the "TwentyTen" theme and you should see no problem for example.

You can look at the HTML WordPress produces and see that the Size (the width and height) specified is correct, it's just the browser is being directed to display it differently (Scroll to the end, notice the 2nd one is 70% values of the top one)

<img class="alignleft size-full wp-image-5" title="540px-WordPress_logo" src="..url.." alt="" width="540" height="123" />

70%: <img class="alignleft size-full wp-image-5" title="540px-WordPress_logo" src="..url.." alt="" width="378" height="86" />

comment:9 @micha152954 years ago

O.k., I've tested the "TwentyTen" theme and it's working perfect in all browsers.
So, if you're sure that a bug is inside of all other themes, I think it would be a good idea to send out a general information, otherwise we cannot use any other theme free of bug at the present time.
You have to publish a information with patch instructions for current used themes also.
At the last please tell me how I have to modify my "Rustic" theme, many thanks.

comment:10 @micha152954 years ago

So far so good, now I've overwritten the whole section "Images" inside the style.css of the "Rustic" theme with the content of the "TwentyTen" theme and it seem to be the solution for the problem.
Maybe the general solution for all other themes with the same bug? - I'm not 100% sure, please tell me if it's right.

comment:11 @iandstewart3 years ago

@SergeyBiryukov I've avoided targeting just IE8 with width:auto for consistency's sake. The width:auto is a hack that introduces a bug (why do my full-size images not scale down correctly?) to squash another bug (why do my full-size images not scale right on my phone or tablet?). It seemed the lesser of two evils.

comment:12 @SergeyBiryukov3 years ago

  • Milestone changed from Awaiting Review to 3.3
  • Resolution set to fixed
  • Status changed from new to closed

Since [18702], size-* classes are removed if the image is soft-resized in TinyMCE.

Note: See TracTickets for help on using tickets.