# Anchor component in coordinate container

**URL:** <https://forum.inductiveautomation.com/t/anchor-component-in-coordinate-container/25716>\
**Category:** Ignition Early Access\
**Created:** [June 11, 2019, 11:31am UTC](https://forum.inductiveautomation.com/t/anchor-component-in-coordinate-container/25716 "2019-06-11T11:31:31Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![chris.roys](https://avatars.discourse-cdn.com/v4/letter/c/e9c0ed/32.png) [@chris.roys](https://forum.inductiveautomation.com/u/chris.roys)\
**Post date:** [June 11, 2019, 11:31am UTC](https://forum.inductiveautomation.com/t/anchor-component-in-coordinate-container/25716/1 "2019-06-11T11:31:31Z")

</div>

Hi  
I need to anchor some component to button right corner of view so if user extend the browser it always anchor at right button corner like app bar icon.  
How can I do that in perspective?

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [June 11, 2019, 2:58pm UTC](https://forum.inductiveautomation.com/t/anchor-component-in-coordinate-container/25716/2 "2019-06-11T14:58:09Z")

</div>

There are several ways to do this, but it all depends on the layout of your View.

One easy way:

1. Construct your View with a Flex Container (`props.direction` set to column).
2. Place what you would like as your “primary” container type first (in the attached View I used a Column Container); we will call this the “Primary” container for this example.
3. Now Place a second Flex Container, and set this Flex Container’s `props.direction` to “column-reverse”.
4. Set the `position.basis` for this Flex Container to whatever height you want your Button to have.
5. Deep-select this child Flex Container and place a third Flex Container, and set this Flex Container’s `props.direction` to “row-reverse”.
6. Deep-select the third Flex Container we just placed and place a button into it.
7. Now go all the way back to the “Primary” container you placed into your root container, and set `position.grow` to `1`.

Your structure should look like this:  
 ![59%20AM](https://us1.discourse-cdn.com/inductiveautomation/original/2X/1/17c5d17033fc4dd9a556b63faff3d5f5dd3761b0.png)

Here’s the View I constructed:  
[view.json](https://us1.discourse-cdn.com/inductiveautomation/original/2X/b/ba2a6eb52b4ab6f16e8f38b55ec420c260833125.json) (1.6 KB)
