# How to manually control height and position of ionicPopover?

**URL:** <https://forum.ionicframework.com/t/how-to-manually-control-height-and-position-of-ionicpopover/13872>\
**Category:** ionic-v1\
**Created:** [December 10, 2014, 12:12pm UTC](https://forum.ionicframework.com/t/how-to-manually-control-height-and-position-of-ionicpopover/13872 "2014-12-10T12:12:02Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![burufeiba](https://avatars.discourse-cdn.com/v4/letter/b/e19b73/32.png) [@burufeiba](https://forum.ionicframework.com/u/burufeiba)\
**Post date:** [December 10, 2014, 12:12pm UTC](https://forum.ionicframework.com/t/how-to-manually-control-height-and-position-of-ionicpopover/13872/1 "2014-12-10T12:12:02Z")

</div>

I come across a problem when using ionicPopover. My popover includes some horizontally aligned items. when the target element is clicked, there should be a popover floats above or below it accrording to its position.

I set the style of ion-popover-view as below:

```
<ion-popover-view style="background-color: black; height: auto; width: 220px; border-radius: 15px;">

```

As result, popover always floats below the target element. Like this:

![](https://sea1.discourse-cdn.com/ionicframework/uploads/default/7725/6d332dccc7f9d21b.png)

If I remove the _height: auto_ , popover can automatically float below or above the element, but the default height is too large.

Any idea to control both height and position of popover manually ?

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [December 11, 2014, 9:07pm UTC](https://forum.ionicframework.com/t/how-to-manually-control-height-and-position-of-ionicpopover/13872/2 "2014-12-11T21:07:42Z")

</div>

Popover has some js running to position it self like you would see on android and ios.

So short answer, you’d have to customize the popover and make your own.

---

<div class="post-metadata">

**Author:** ![Marutharaj](https://avatars.discourse-cdn.com/v4/letter/m/839c29/32.png) [@Marutharaj](https://forum.ionicframework.com/u/Marutharaj)\
**Post date:** [August 12, 2016, 10:32am UTC](https://forum.ionicframework.com/t/how-to-manually-control-height-and-position-of-ionicpopover/13872/3 "2016-08-12T10:32:25Z")

</div>

Hi i am using ionic popover with this jquery  
$(document).on(“mouseup”,".class",function(e){  
//open popover here.  
})

but i did not get popover position where i clicked.  
it render it to corner position by delegate target.

is there is any way to fix the position of popover where i clicked in this case.
