Do you have a preview link of the functional version that was created in v2, for us to view and get a general idea of your process.
A banner image at 540height? Ah thats some banner size. I digress. But in terms of proportional 'fitting' there is no way that just 0, auto did this for you in the previous version.
There must be another setting in place somewhere in your ver2 file that you got it to work.
Please post a link.
Already thank you for replying to my posts, it is much appreciated.
Did I say banner? I meant header. You'll find an example of a centered, scaling image that I put on:
You can also get a general idea of what I'm trying to achieve here, which also relates to my other post we're discussing. I'm building this parallax website in edge, and it has a number of elements which do different things. There's basically all the backgrounds for different sections, which have a fixed height and a 100% width. Then there will be the actual content, in a 960 safe zone, centered in the middle. I hope this explains why I can't use the new responsive scaling and centering options in ver3. These work over the whole stage, on every element on the stage, while I want different elements to do different things.
But to stay on topic of this specific post:
I believe what I did with this image was the following (I say believe because I can't check back since ver3 messed up this file):
I made rectangle on the main stage and then converted it to a symbol. This symbol had a fixed height and 100% width. Inside this symbol I put the image as a div, and used one of the Edge presets to center the image. Then I changed the width to 100% and the height to auto, and that gave the result you're seeing in the example.
What happened when I updated to ver3 is that it just deleted the image from the symbol it was in. It also changed the overflow to scroll for some weird reason, and all the setting in 100% width were also gone.
In ver3 I can't use the same trick I did to center and scale the image as I used in ver2, in fact a number of things are different:
- If you create a symbol, you can't set its width (or height) to 100% anymore. At least not while you're on the main stage that the symbol is on.
- If you go into the symbol, and change the instance to resize rather than scale, then you can start working with percentage widths.
My first question here is if this is intentional, or a bug. In some ways it makes sense to me, but it seems a little odd that this change was made to ver3 and messes with files created in ver2.
- Then, if you insert an image in a div, and use the center preset, you cannot set the width of the image to 100% anymore. (This was possible in ver2.)
What all this boils down to is that:
1. I would love to understand more about the changes made in Edge ver3, specifically why so much has changed with the percentage value options for responsive scaling.
2. I would still love to find out the best way to have a centered and scaling background image.
It appears that when I first select the 'center background image' preset, and then also select the 'scale background image' preset, I seem to get what I want.
It doesn't always completely fill the background of my top header, especially when you make the browser width really small, but if I set a minimum width and be smart about the dimensions of my background image, this could work.
Still, the last two questions of my previous post still stand..