Caution With Effect Size

Depending on your effect and the angle, your element size may change to reflect the effect applied to the element. Web-based environments such as HTML and CSS, do not use run-time filters – but rather element filters. Element filters apply directly to an element and cause the all coordinate properties of the element to change.

An example of this is the Glow Effect. In HTML (and other environments), the size of the glow must reflect the size of the element (eg. overflow:hidden;).

Eg. If you have a rectangle 100x100, with a 5px glow = actual HTML size 110x110.


Convert the element to a Smart Object, then mask the unnecessary area. Or you can use CSS and add a custom class to your HEAD.

.nooverflow{ overflow:hidden; }

Then add ${css|style:nooverflow} to your parent folder, this will prvent the effect from bleeding.

LOGIN NOW: Get instant access to our free Online Training - click here.

02. Using The Plugin

03. Layer Support

04. Basic Exports

05. Layer Tags

06. Optimization Tips

07. Complete Exports

🚀 Start saving time and money!