Highlighted

display responsive art flush in browser

Engaged ,
Jan 14, 2018

Copy link to clipboard

Copied


This is so basic, but I can't figure it out. Something about a fluid width on them both?

PHOTO 1) Photo is flush left and right, does not exceed live area (not exceeding live area I am told is important). Brown/tan band is the same.

PHOTO 2) Is how it displays in chrome browser. I just want brown/tan band flush to the photo so it's all nice and neat.

                      PHOTO 1
Screen Shot 2018-01-14 at 4.40.54 PM.png

                      PHOTO 2 IN BROWSER, GOOD RESPONSIVE REFLOW ON BUTTONS

Screen Shot 2018-01-14 at 3.45.23 PM.png

thanks.

* * * *

anita1390  написал(а)

The problem is only the brown band below the main image, I used the rectangle tool and filled it.  The main top photo is fine, I do not need it to fill browser width. I need the brown/tan to maintain the same width as the photo above it and have tried different resize options (see Photo 3 below).

Very simple. The first thing you have to do is install the image correctly. You must establish it within these boundaries.
1a9cd2d385.png

Secondly, delete the brown rectangle under the image and simply fill the page with a brown color.

4e1ff2102c.png

Or use an alternative, consisting of rectangles, if you need different colors for the background.

9389564680.png

Views

271

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

display responsive art flush in browser

Engaged ,
Jan 14, 2018

Copy link to clipboard

Copied


This is so basic, but I can't figure it out. Something about a fluid width on them both?

PHOTO 1) Photo is flush left and right, does not exceed live area (not exceeding live area I am told is important). Brown/tan band is the same.

PHOTO 2) Is how it displays in chrome browser. I just want brown/tan band flush to the photo so it's all nice and neat.

                      PHOTO 1
Screen Shot 2018-01-14 at 4.40.54 PM.png

                      PHOTO 2 IN BROWSER, GOOD RESPONSIVE REFLOW ON BUTTONS

Screen Shot 2018-01-14 at 3.45.23 PM.png

thanks.

* * * *

anita1390  написал(а)

The problem is only the brown band below the main image, I used the rectangle tool and filled it.  The main top photo is fine, I do not need it to fill browser width. I need the brown/tan to maintain the same width as the photo above it and have tried different resize options (see Photo 3 below).

Very simple. The first thing you have to do is install the image correctly. You must establish it within these boundaries.
1a9cd2d385.png

Secondly, delete the brown rectangle under the image and simply fill the page with a brown color.

4e1ff2102c.png

Or use an alternative, consisting of rectangles, if you need different colors for the background.

9389564680.png

Views

272

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jan 14, 2018 0
LEGEND ,
Jan 14, 2018

Copy link to clipboard

Copied

I think, your issue is solvable.

Please read my first answer in this thread: https://forums.adobe.com/thread/2435653 and try to follow the recommendations.

Perhaps your issue is, that the horse image is placed as an image. Placed images can‘t be stretched to browser width. A solution in this case can be to use a simple rectangle, which you stretch browser wide, and fill it with the horse image. (Click onto „Fill“ in Muse‘s upper control strip and choose an image.)

If you have no luck, could  you please delete all pages of your site but the one, shown in your photos and delete all elements except the element, we can see in your photo?

Save this reduced .muse file under a new name and share it with us, using Dropbox, CC Files, or a similar file sharing service. You may follow these recommendations: https://forums.adobe.com/docs/DOC-8652. Then we can have a closer look.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Most Valuable Participant ,
Jan 14, 2018

Copy link to clipboard

Copied

to add on, all the text is being turned into images (as the screenshot shows) ... this will be a big problem when it comes to getting the design working within some devices

Screenshot (3).png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Engaged ,
Jan 14, 2018

Copy link to clipboard

Copied

The problem is only the brown band below the main image, I used the rectangle tool and filled it.  The main top photo is fine, I do not need it to fill browser width. I need the brown/tan to maintain the same width as the photo above it and have tried different resize options (see Photo 3 below).

Ussnorway, thanks but I have been running this exact text inside boxes (output as PNGs) ever since the first release of Muse and have never had a browser problem. I do not have a problem with them now.

PHOTO 3: SOME OPTIONS I HAVE TRIED TO HAVE THE BROWN/TAN BOX MAINTAIN THE SAME WIDTH AS THE PHOTO ABOVE IT

Screen Shot 2018-01-14 at 5.06.56 PM.png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Adobe Community Professional ,
Jan 14, 2018

Copy link to clipboard

Copied

If I understand it right, simply set this brown rectangle to "Stretch to browser width". The height keeps the same. If you set it to resize in width and height, it could get too small, I'm afraid, for the text boxes/buttons (are these buttons?).

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Engaged ,
Jan 14, 2018

Copy link to clipboard

Copied

Gunther, I changed the text box (it was originally drawn with the text box tool) == and created an art box. Regardless of the pinning options or the resize box options (I tried them all) the results look like this, Photo 4. The box width stays correct but it flows to the left

PHOTO 4 BROWSER VIEW: IS AN ART BOX FILLED WITH BROWN/TAN COLOR

Screen Shot 2018-01-14 at 8.04.13 PM.png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Engaged ,
Jan 14, 2018

Copy link to clipboard

Copied

Uwe, that is the problem -- I don't want it to browser width. I want it to remain the original width, just like the photo above it remains.

Whether the "Set to browser width" is on or off, it behaves the same by expanding to browser width. Somehow the photo above it behaves correctly.

Yes, those boxes will have hyperlinks (your question are those buttons).

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Adobe Community Professional ,
Jan 14, 2018

Copy link to clipboard

Copied

You asked me where to find the "Stretch to browser width". I was not able to open the thread from your last question towards me, directly, so I went to my browser history.

You already had this option here:

Bildschirmfoto 2018-01-15 um 02.29.18.png

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
Adobe Community Professional ,
Jan 14, 2018

Copy link to clipboard

Copied

I think now is the perfect timing to show us a .muse.

Your image from your original post seems to be stretched to browser width. Is it like this or do you use a fixed image with no resizing?

Just into the blue, if you use a rectangle, fill it with an image, use the same tool – add another rectangle, fill it with a colour, use same settings/resizing for image and colour, everything should be fine.

If there's a misunderstanding, provide a .muse, only that one page, with these elements, share it via CC-library or via dropbox.

Thanks in advance,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 14, 2018 0
LEGEND ,
Jan 15, 2018

Copy link to clipboard

Copied

8 posts – and no step further!

Why don’t you simply follow my proposal in post #1, and share a one-page-file with us? I bet, you’d have a solution since hours!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 15, 2018 0
Guide ,
Jan 15, 2018

Copy link to clipboard

Copied

anita1390  написал(а)

The problem is only the brown band below the main image, I used the rectangle tool and filled it.  The main top photo is fine, I do not need it to fill browser width. I need the brown/tan to maintain the same width as the photo above it and have tried different resize options (see Photo 3 below).

Very simple. The first thing you have to do is install the image correctly. You must establish it within these boundaries.
1a9cd2d385.png

Secondly, delete the brown rectangle under the image and simply fill the page with a brown color.

4e1ff2102c.png

Or use an alternative, consisting of rectangles, if you need different colors for the background.

9389564680.png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jan 15, 2018 0