Ok button of ionicPopup is not aligned properly


I’m using a very basic ionicPopup to show alert message with only ‘ok’ button, and notice that the button is not align properly. This is the code:

var showAlert = function(msg, title) {

 var alertPopup = $ionicPopup.alert({
   template: 'hello world',
   okText: 'ok'
 alertPopup.then(function(res) {

and this is how it looks like:


looks strange and i dont have this kind of problem.
do you have a codepen so we can find the problem?


no… but as far as I can tell the code I posted is the only relevant one…


sorry, I can’t reply properly. I noticed that I have the following css in my index.html:

 <link href="css/bootstrap/3.1.1/bootstrap.min.css" rel="stylesheet">

once I commented the popup looks ok. Not sure why I added it originally and if it’s really needed.


another update: I added this css for angularjs typeahead component, apparently it’s not fully compatible with Ionic.


sorry was not accurate i mean css :smiley:
its possible that 3th party css do not work well with ionic

as far im trying just to use ionic css + my customisation


yes. I’ll try to do the same. thanks.


If you really need Bootstrap include it before Ionics CSS, then make sure that popup.button’s properties have ! important set.


Thanks. Adding the following css solved the problem:

 .popup div.row {
  	margin-left: 0px;


This worked for me! thanks!