# Width equal to Height

**URL:** <https://forums.fusetools.com/t/width-equal-to-height/2133>\
**Category:** How-to Discussions\
**Created:** [April 28, 2015, 9:01pm UTC](https://forums.fusetools.com/t/width-equal-to-height/2133 "2015-04-28T21:01:31Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Cristian\_Karmy1](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/cristian_karmy1/32/480_2.png) [@Cristian\_Karmy1](https://forums.fusetools.com/u/Cristian_Karmy1)\
**Post date:** [April 28, 2015, 9:01pm UTC](https://forums.fusetools.com/t/width-equal-to-height/2133/1 "2015-04-28T21:01:31Z")

</div>

If I have a Panel with a Width of 100% of the screen, how can I set the Height equals to the value of Width (I want a square Panel of 100% of screen width but the screen height of the devices are diferent).

Thanks!

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [April 29, 2015, 6:46am UTC](https://forums.fusetools.com/t/width-equal-to-height/2133/2 "2015-04-29T06:46:04Z")

</div>

There’s unfortunately no easy way to do this right now. You’ll have to use some Uno code, and likely a custom control to do the layout.

Can you give me an example of what you have now and tell me which part you’d like to have with a fixed aspect ratio? I can then maybe look at putting together an example for you.

---

<div class="post-metadata">

**Author:** ![Cristian\_Karmy1](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/cristian_karmy1/32/480_2.png) [@Cristian\_Karmy1](https://forums.fusetools.com/u/Cristian_Karmy1)\
**Post date:** [April 29, 2015, 12:58pm UTC](https://forums.fusetools.com/t/width-equal-to-height/2133/3 "2015-04-29T12:58:39Z")

</div>

But better make a simpler example instead of upload my project that have many things.

If you have time, how can I do something like this:

```auto
<Image ux:Name"MyImage" WidthUnit="Percent" Width="90" StretchMode="UniformToFill" />

```

How can in Uno make that the MyImage.Height = MyImage.Width?

---

<div class="post-metadata">

**Author:** ![mircea](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@mircea](https://forums.fusetools.com/u/mircea)\
**Post date:** [September 15, 2016, 9:17am UTC](https://forums.fusetools.com/t/width-equal-to-height/2133/4 "2016-09-15T09:17:51Z")

</div>

I know this is out of date but maybe it will help other people who run into the problem. Here’s a solution that solves a similar problem, relying on a square transparent image to set the proper aspect ratio of the container (width=height) and then “floating” on top of it the actual content you want to display:

> <http://pastebin.com/raw/1jX3dd3R>

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [September 15, 2016, 9:28am UTC](https://forums.fusetools.com/t/width-equal-to-height/2133/5 "2016-09-15T09:28:59Z")

</div>

We’ve actually added an aspect layout option since then.

```auto
<Panel Width="100%" BoxSizing="FillAspect" Aspect="1">

```

The panel will be the same height as the width. The key bit is `BoxSizing="FillAspect" Aspect="1"` which enables aspect based sizing (to fill the space that is has, or with an explicit width/height). The `Aspect` is the `X/Y` ratio.

---

<div class="post-metadata">

**Author:** ![mircea](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@mircea](https://forums.fusetools.com/u/mircea)\
**Post date:** [September 15, 2016, 9:30am UTC](https://forums.fusetools.com/t/width-equal-to-height/2133/6 "2016-09-15T09:30:17Z")

</div>

Nice. Keep up the good work!