How to hide overflow v1.9.0

502 views
Skip to first unread message

luv...@gmail.com

unread,
Oct 5, 2017, 2:53:18 PM10/5/17
to Google Web Designer beta
Like many others, I cannot see how to hide the assets that appear outside of the stage boundaries.

I am testing in New Blank File > Interstitial > DoubleClick > Dual > 350x250 > Responsive layout

Jaz writes :
"Yes, in the Property Inspector you can change the option on Overflow, from visible to hidden."

But there is no Property Inspector from what I can see - there is only a Properties panel, and I do not see that option.

I can drag an asset onto the stage, then select Overflow hidden in the Properties panel, but that does nothing. Even if it did work, I shouldn't have to do that for each asset - I want it to happen globally.

I have opened the code view and put "overflow:hidden;" in various places but nothing works. The "Match viewport" button seems do do nothing, and I don't see "matchviewport" in the code, so I can't remove it as another user suggested.

Thanks in advance for your help!
Hopefully as soon as I hit "post" I'll figure it out ;)

Message has been deleted

San Khong

unread,
Oct 5, 2017, 4:09:28 PM10/5/17
to Google Web Designer beta
When you create a file from Interstitial type, by default, responsive it checked in the UI. This means that your ad is 100% by 100% in width and height so the contents will show depending on viewport size. In the browser preview window (which is huge), all contents will show. 

The best way to test a responsive ad to see how your ad will show on a device is to preview in Chrome, right click and select Inspect, then click the second icon (Toggle device toolbar) in dev tool, then you should see the device sizes at the top of the ad, and you can pick different devices to view them in. Then you can author your ad by adding different breakpoints and layout your content differently for each size. 

GWD Help Topic:
https://support.google.com/webdesigner/answer/7002913?hl=en&ref_topic=7003209

Breakpoints : https://support.google.com/webdesigner/answer/7002914?hl=en&ref_topic=7003209

YouTube tutorials:

Responsive Layout: Overview - https://youtu.be/pdEoLrGwMTY

Responsive Layout: Advanced Techniques - https://youtu.be/wk5QqUyvCso

Responsive Layout: Animation - https://youtu.be/pl5j3FfXdM4

If you don't want to build a fixed size ad instead of a responsive ad, click on an empty area on the stage to see the Page in the Properties panel, and change the width and height to pixel instead of %.

Hope it helps.
San
Google Web Designer team
Reply all
Reply to author
Forward
0 new messages