Project

General

Profile

Actions

Bug #62902

closed

csc-textpic rendering and styles breaks responsive images in Firefox

Added by Jan Kiesewetter over 9 years ago. Updated about 8 years ago.

Status:
Closed
Priority:
Should have
Assignee:
-
Category:
Content Rendering
Start date:
2014-11-13
Due date:
% Done:

0%

Estimated time:
TYPO3 Version:
6.2
PHP Version:
Tags:
Complexity:
Is Regression:
No
Sprint Focus:

Description

The current css_styled_content rendering and css of image/textpic breaks the possibility to use responsive images with

img {
max-width: 100%;
height: auto;
}

Image doesn't scale down.

This effects current Firefox. Chrome works...

There is a bug report for Firefox since 02.2014 but it reads as it won't be fixed.
https://bugzilla.mozilla.org/show_bug.cgi?id=975632

Actions #1

Updated by Riccardo De Contardi almost 9 years ago

try to set the container of the image (that is .csc-textpic-image) as:

.csc-textpic-image{
    display:table;
    table-layout: fixed;
    width: 100%;
}

this seems to work.

Actions #2

Updated by Riccardo De Contardi over 8 years ago

  • Target version set to Candidate for patchlevel
Actions #3

Updated by Riccardo De Contardi over 8 years ago

I write here my minimal setup to reproduce the bug:

 config.doctype=html5

  page.cssInline{
  10=TEXT
  10.value = img{max-width:100%;height:auto;}

}
 page.10 < styles.content.get

Steps to reproduce: add a large image; resize (reduce) the browser window; Result:
1) On chrome the image is resized (is "responsive")
2) On Firefox, the image stays fixed and becomes "cropped"

On version 7.6.x and Fluid Style Content, the CSS should be:

.ce-gallery figure{
  display:table;
  width:100%;
  table-layout:fixed;
}

ALERT

I've discovered that my solution interferes with some layouts, e.g. "above, center" or "below, center" because the width:100% removes the centering.

Actions #4

Updated by Riccardo De Contardi about 8 years ago

Looking at the bug report https://bugzilla.mozilla.org/show_bug.cgi?id=975632 it seems that this bug has been fixed in Firefox 46 (release: late April)

Actions #5

Updated by Riccardo De Contardi about 8 years ago

  • Status changed from New to Closed

I close this because the bug in Firefox has been fixed in version 46, please update your browser.

If you think this is the wrong decision or experience the issue again, then let us know (on Slack for example - https://typo3.slack.com/ ) or open a new ticket and add a relation to this ticket number. Thank you.

Actions

Also available in: Atom PDF