# \[Resolve\] Problem with IonicPopup size

**URL:** <https://forum.ionicframework.com/t/resolve-problem-with-ionicpopup-size/20247>\
**Category:** ionic-v1\
**Created:** [April 3, 2015, 2:45pm UTC](https://forum.ionicframework.com/t/resolve-problem-with-ionicpopup-size/20247 "2015-04-03T14:45:15Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![christlibon](https://avatars.discourse-cdn.com/v4/letter/c/ac8455/32.png) [@christlibon](https://forum.ionicframework.com/u/christlibon)\
**Post date:** [April 3, 2015, 2:45pm UTC](https://forum.ionicframework.com/t/resolve-problem-with-ionicpopup-size/20247/1 "2015-04-03T14:45:16Z")

</div>

Hi!  
I have a custom ionicPopUp and I try to change the height and the width of it, but it doesn’t work. Can you help me?

myPopup:

```
var myPopup = $ionicPopup.show({
      templateUrl: "product-popup.html",
      scope: $scope,
      buttons: [
        { text: 'Fermer',
          type: 'button-bleu'
        }
      ]
    });
 };

```

The HTML template:

```
<script id="product-popup.html" type="text/ng-template">
                <table class="popup-produit-item">
                    <tr><td colspan='2'><img src='img/shop/{{item.image}}.jpg' class="fullsize"/></td></tr>
                    <tr><th>Produit</th></tr><tr><td>{{item.title}}</td></tr>
                    <tr><th>Caractéristiques</th></tr><tr><td>{{item.feature}}</td></tr>
                    <tr><th>Format</th></tr><tr><td>{{item.format}})</td></tr>
                    <tr><th>Impression</th></tr><tr><td>{{item.print}}</td></tr>
                </table>
            </script>

```

The CSS:

```
.popup{
width: 600px;
height: 450px;
}

```

The height is working fine but the width is never modify (I’ve tried several value).

---

<div class="post-metadata">

**Author:** ![brandyshea](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/brandyshea/32/148286_2.png) [@brandyshea](https://forum.ionicframework.com/u/brandyshea)\
**Post date:** [April 3, 2015, 5:18pm UTC](https://forum.ionicframework.com/t/resolve-problem-with-ionicpopup-size/20247/2 "2015-04-03T17:18:28Z")

</div>

The width is set here

```
.popup-container .popup {
    width: 250px
}

```

So you can override it using !important:

```
.popup{
    width: 600px !important;
    height: 450px;
}
```

---

<div class="post-metadata">

**Author:** ![christlibon](https://avatars.discourse-cdn.com/v4/letter/c/ac8455/32.png) [@christlibon](https://forum.ionicframework.com/u/christlibon)\
**Post date:** [April 7, 2015, 6:18am UTC](https://forum.ionicframework.com/t/resolve-problem-with-ionicpopup-size/20247/3 "2015-04-07T06:18:20Z")

</div>

Hi!  
Finally, I change the width directly in `.popup-container .popup`.  
Thank you for your answer, I wouldn’t think it was so simple! 😉