X
Πατήστε εδώ για μετάβαση στην έκδοση της ιστοσελίδας για κινητές συσκευές.

Φόρουμ υποστήριξης

Lightroom photogalleries in cropped in Firefox.

Δημοσιεύτηκε

I have created a number of galleries with LR and then inserted them in existing web pages in my web site. While the galleries work fine in both Chrome and IE, there is a problem with the Firefox browser. Thumbnails show fine but when enlarging the photo it is cropped and thus only part of it is shown. I have tried inserting the gallery using both an Iframe and as an object/embed, same result, fine in Chrome and IE but individual photos cropped in Firefox.

Any solution to this?

I have created a number of galleries with LR and then inserted them in existing web pages in my web site. While the galleries work fine in both Chrome and IE, there is a problem with the Firefox browser. Thumbnails show fine but when enlarging the photo it is cropped and thus only part of it is shown. I have tried inserting the gallery using both an Iframe and as an object/embed, same result, fine in Chrome and IE but individual photos cropped in Firefox. Any solution to this?

Επιλεγμένη λύση

The embedded page uses some style rules to override the normal display behavior. There probably are aesthetic reasons for this that I'm not aware of, but cumulatively, they cause the div elements around the image to ignore the 100% width setting.

(1) #loupeContainer div.image-container {display: table}

Tables are inherently stretchy and will expand to fit their contents despite a width:100% unless this rule also is set:

table-layout:fixed

(2) #loupeContainer div.image-container div.image {display: table-cell}

Same as #1, but the fixed rule needs to be on the display:table element.

(3) #loupeContainer div.corners {display: inline-block}

The image doesn't shrink to fit when this is changed from the default display of block to inline-block


What puzzles me is that it works outside the iframe, i.e., when opened stand-alone in a separate tab. I think my only suggested workaround would be to shorten the height of the iframe so it is more of a 4:3 shape than a 1:1 shape.

Ανάγνωση απάντησης σε πλαίσιο 1

Επιπρόσθετες λεπτομέρειες συστήματος

Εγκατεστημένα αρθρώματα

  • Adobe PDF Plug-In For Firefox and Netscape 11.0.10
  • A plugin to detect whether the Adobe Application Manager is installed on this machine.
  • 2.3.0
  • 0.70.4
  • Google Update
  • Intel web components for Intel® Identity Protection Technology
  • Intel web components updater - Installs and updates the Intel web components
  • Next Generation Java Plug-in 10.71.2 for Mozilla browsers
  • The plugin allows you to have a better experience with Microsoft SharePoint
  • NVIDIA 3D Vision Streaming plugin for Mozilla browsers
  • NVIDIA 3D Vision plugin for Mozilla browsers
  • NPWLPG
  • The QuickTime Plugin allows you to view a wide variety of multimedia content in Web pages. For more information, visit the QuickTime Web site.
  • Shockwave Flash 17.0 r0
  • 5.1.40416.0
  • WildTangent Games App V2 Presence Detector

Εφαρμογή

  • Πλατφόρμα χρήστη: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:39.0) Gecko/20100101 Firefox/39.0

Περισσότερες πληροφορίες

the-edmeister
  • Top 25 Contributor
  • Moderator
5425 λύσεις 40505 απαντήσεις
Δημοσιεύτηκε

URL example where we can see that?

URL example where we can see that?
FredMcD
  • Top 10 Contributor
4350 λύσεις 61153 απαντήσεις
Δημοσιεύτηκε

Have you checked your zoom controls.

<Control> + (plus) enlarge <Control> - (minus) reduce <Control> 0 (zero) restore

Have you checked your zoom controls. <Control> '''+''' (plus) enlarge <Control> '''-''' (minus) reduce <Control> '''0''' (zero) restore
Δημοσιεύτηκε

Ιδιοκτήτης ερώτησης

NielsE said

I have created a number of galleries with LR and then inserted them in existing web pages in my web site. While the galleries work fine in both Chrome and IE, there is a problem with the Firefox browser. Thumbnails show fine but when enlarging the photo it is cropped and thus only part of it is shown. I have tried inserting the gallery using both an Iframe and as an object/embed, same result, fine in Chrome and IE but individual photos cropped in Firefox. Any solution to this?

An example can be found in the following url: http://www.nielsenevoldsen.eu/L%27Amarante/Pages/ConstrDetails/AmaranteConstrDetailsEN.html

''NielsE [[#question-1066987|said]]'' <blockquote> I have created a number of galleries with LR and then inserted them in existing web pages in my web site. While the galleries work fine in both Chrome and IE, there is a problem with the Firefox browser. Thumbnails show fine but when enlarging the photo it is cropped and thus only part of it is shown. I have tried inserting the gallery using both an Iframe and as an object/embed, same result, fine in Chrome and IE but individual photos cropped in Firefox. Any solution to this? </blockquote> An example can be found in the following url: http://www.nielsenevoldsen.eu/L%27Amarante/Pages/ConstrDetails/AmaranteConstrDetailsEN.html
Δημοσιεύτηκε

Ιδιοκτήτης ερώτησης

An example can be found in the following url: http://www.nielsenevoldsen.eu/L%27Amarante/Pages/ConstrDetails/AmaranteConstrDetailsEN.html
the-edmeister
  • Top 25 Contributor
  • Moderator
5425 λύσεις 40505 απαντήσεις
Δημοσιεύτηκε

I see what you are referring to - it looks like the image is too large for the frame that you have it set in. Not affected by page zoom, either. Approx 10% of the right side of the image is lopped off on my 1600 x 900 monitor, and amount that is lost stays consistent when I "minimize" the browser window and drag it smaller (along with zooming as I already mentioned).

Looks like a webpage development issue and differences between how the different browser engines handle your code. Beyond the scope of this forum, although someone here may have some suggestions to correct it for Firefox / Gecko during the upcoming week.

I see what you are referring to - it looks like the image is too large for the frame that you have it set in. Not affected by page zoom, either. Approx 10% of the right side of the image is lopped off on my 1600 x 900 monitor, and amount that is lost stays consistent when I "minimize" the browser window and drag it smaller (along with zooming as I already mentioned). Looks like a webpage development issue and differences between how the different browser engines handle your code. Beyond the scope of this forum, although someone here may have some suggestions to correct it for Firefox / Gecko during the upcoming week.

Τροποποιήθηκε στις από το χρήστη the-edmeister

jscher2000
  • Top 10 Contributor
8899 λύσεις 72797 απαντήσεις
Δημοσιεύτηκε

Επιλεγμένη λύση

The embedded page uses some style rules to override the normal display behavior. There probably are aesthetic reasons for this that I'm not aware of, but cumulatively, they cause the div elements around the image to ignore the 100% width setting.

(1) #loupeContainer div.image-container {display: table}

Tables are inherently stretchy and will expand to fit their contents despite a width:100% unless this rule also is set:

table-layout:fixed

(2) #loupeContainer div.image-container div.image {display: table-cell}

Same as #1, but the fixed rule needs to be on the display:table element.

(3) #loupeContainer div.corners {display: inline-block}

The image doesn't shrink to fit when this is changed from the default display of block to inline-block


What puzzles me is that it works outside the iframe, i.e., when opened stand-alone in a separate tab. I think my only suggested workaround would be to shorten the height of the iframe so it is more of a 4:3 shape than a 1:1 shape.

The embedded page uses some style rules to override the normal display behavior. There probably are aesthetic reasons for this that I'm not aware of, but cumulatively, they cause the div elements around the image to ignore the 100% width setting. (1) #loupeContainer div.image-container {display: table} Tables are inherently stretchy and will expand to fit their contents despite a width:100% unless this rule also is set: table-layout:fixed (2) #loupeContainer div.image-container div.image {display: table-cell} Same as #1, but the fixed rule needs to be on the display:table element. (3) #loupeContainer div.corners {display: inline-block} The image doesn't shrink to fit when this is changed from the default display of block to inline-block ---- What puzzles me is that it works outside the iframe, i.e., when opened stand-alone in a separate tab. I think my only suggested workaround would be to shorten the height of the iframe so it is more of a 4:3 shape than a 1:1 shape.
Δημοσιεύτηκε

Ιδιοκτήτης ερώτησης

Thanks jscher.

Changing the frame to the ratio 4:3 actually worked.

Thanks jscher. Changing the frame to the ratio 4:3 actually worked.
jscher2000
  • Top 10 Contributor
8899 λύσεις 72797 απαντήσεις
Δημοσιεύτηκε

Thanks for the confirmation. It's hard to tell whether playing around with settings in the Inspector tool will work in real life so I'm glad to hear it did.

Thanks for the confirmation. It's hard to tell whether playing around with settings in the Inspector tool will work in real life so I'm glad to hear it did.