Project

General

Profile

Actions
Copy link

Bug #62902

closed

csc-textpic rendering and styles breaks responsive images in Firefox

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

Status:
Closed
Priority:
Should have
Assignee:
-
Category:
Content Rendering
Target version:
Candidate for patchlevel
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
Copy link
 #1

Updated by Riccardo De Contardi over 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
Copy link
 #2

Updated by Riccardo De Contardi almost 9 years ago

  • Target version set to Candidate for patchlevel
Actions
Copy link
 #3

Updated by Riccardo De Contardi almost 9 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
Copy link
 #4

Updated by Riccardo De Contardi over 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
Copy link
 #5

Updated by Riccardo De Contardi over 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
Copy link

Also available in: Atom PDF