RESOLVED: Flare breaks IMG width as percentage >= 60%

This forum is for all Flare issues related to the HTML5, WebHelp, WebHelp Plus, and Adobe Air Targets
Post Reply
Phlawm53
Sr. Propeller Head
Posts: 442
Joined: Tue Mar 16, 2010 10:58 am
Location: San Francisco, CA
Contact:

RESOLVED: Flare breaks IMG width as percentage >= 60%

Post by Phlawm53 »

------
Flare 11, HTML5 output.

Flare mysteriously changes image (IMG tag) size from percentage to "style="width: 1;height: 1;" after the percentage value >= 60% or so.

STEPS:
  1. I create a two column table with both table columns set to 50% width. So far, so good. (I am, incidentally, applying a named table style that works well in all other regards.)
  2. In the left table column, I insert an image and apply a class, "sideBySide" that specifies "width: N%;" where N is an integer value. My expectation is that, ideally, I can specify "width: 90%;" and "height: auto;" and have the image fit into 90-percent of the containing table column's width. I say "ideally" because as we will see, something is about to get broken.
  3. IF I specify N = 50% or less, the image is, as expected, not greater than 50-percent of the table column. That is of course too small: it is indeed only 50-percent of the table column. BUT it does show me that values of N less than 50% are controlling the image's width as a percentage of the containing table column.
  4. IF N = 60% or greater, (a) then in the output Flare displays a gray box, and (b) the generated page's XHTML includes style="width: 1;height: 1;". This forces the image to revert to 1 pixel X 1 pixel which is of course unusable. This is happening even though a value of 60-percent isn't close to filling the table column's width.
What's also puzzling is that for troubleshooting purposes I used generic CSS elements as follows:
  1. Created a generic (no class name) 1-row X 2-column table, set up the table width = 100% and columns = 50%.
  2. Inserted a generic IMG (no class name applied), then in the XHTML itself inserted "style="height: auto; width: 60%;".
Same result: If in the XHTML itself I specify "width: 50%" or less, output works as expected. Specify 60% and the graphic disappears and in the generated output Flare inserts style="width: 1;height: 1;" as described above.

What's going on? Why is this breaking in this way?

Cheers & thanks for your help,
Riley
Last edited by Phlawm53 on Wed Jul 01, 2015 2:34 pm, edited 1 time in total.
Phlawm53
Sr. Propeller Head
Posts: 442
Joined: Tue Mar 16, 2010 10:58 am
Location: San Francisco, CA
Contact:

RESOLVED: Flare breaks IMG as percentage >= 60%

Post by Phlawm53 »

------
Found it!

In the HTML5 Target Editor, in the Advanced tab, clear Generate resized copies of scaled images. It's selected by default.

Save modified Target, Build, enjoy.

The key troubleshooting step was that I went into the output HTML5 and edited the IMG's size attributes in the output code. After doing this the image's presentation in a browser remained broken. So I realized that something was happening to the image during output. And so to The Setting. Sigh…

Hope this helps another mystified user,
Riley
SFO
Post Reply