cotag / orbicular

A CSS based circular progress bar for AngularJS
MIT License
47 stars 15 forks source link

resize attribute doesn't work #17

Closed aroncal closed 9 years ago

aroncal commented 9 years ago

I put the resize attribute on the <orbicular> tag. When i rotate the screen from portrait to landscape, the orbicular resizes to fit the new width, so it becomes bigger thant the viewport, and less than the top half of the circle is now visible:

<orbicular progression="downloaded" total="size" resize>
        <div>{{foo}}</div>
</orbicular>

orbicular_landscape

stakach commented 9 years ago

This is by design. By default an element height is 0px however block elements assume their parents width. So the simplest method for determining height is by using the width, as width and height must be the same.

Whatever width you set the circles direct parent to will be the circles height. The resize option is there for pages with responsive designs - where the circles parents widths may change depending on media queries