Hype's Width Extends Beyond Parent Div Width

1

Ok Check out this page.

http://ces-ltd.com/energy-solutions/load-management-solutions-wheel/

Can you see how the wheel extends beyond the parent div called .right-general?

For the life of me I can’t figure out how to get the hype wheel to reduce in size. Any idea why?

  • I’ve tried to modify the call style=“margin:auto;position:relative;width:50%!important; height:50%!important; overflow:hidden;” aria-live=“polite”

  • I’ve tried housing the hype call in a div and and making that smaller with no joy.

  • I’ve tried modifying the css for .right-general and countless other divs.

Nothing seems to get that call smaller.

What really drive me crazy is that the wheel will reduce in size as you look at it in different browser widths.

Thank in advance for any thoughts or solutions you may have.

2

The Hype JavaScript is what defines the width of those elements, so you’re going to need to get into the Hype document and enable some responsive features so that the Hype document adjusts based on the width of its container.

Here’s a couple chapters on what you can do with responsive / flexible stuff in Hype:

http://tumult.com/hype/documentation/3.0/#responsive-layouts (These layouts are kicking in as you adjust the width of the container)

This section (Under: Scaling several objects proportionally based on the Tumult Hype document’s container: shows how to adjust a group so that it fits the available space of a document:
http://tumult.com/hype/documentation/3.0/#scaling