Bug in button-with-icon styling


Hi guys,

I noticed a bug in the button styling. When I create a new with the following class: “button button-outline button-block button-energized icon-right ion-chevron-right” like so:

<button class="button button-outline button-block button-energized icon-right ion-chevron-right disable-user-behavior">Login</button>

The ‘Login’ text doesn’t align vertically anymore. When I remove the icon-right class, it works again.

I’m using Ionic v0.9.26

Edit; after posting this, I thought about posting the issue to Github. So I did now: https://github.com/driftyco/ionic/issues/739


The general “icon-right” doesn’t align very well either:

<a class="button icon-right ion-chevron-right button-calm">Learn More</a>


@Calendee This is my situation:


Just tried this with the nightly and things are lining up


Strange. I don’t have any custom styling; just plain Ionic css.

Is there a difference between the nightly and v0.9.26 ?


There are a few changes here and there, basically ones that just close issues on github. My suggestion is to either use the nightly builds or just update the js and css daily via gihub.

I personally like using the nighty builds so that way I can see if there are any errors and point them out.

<link href="http://code.ionicframework.com/nightly/css/ionic.min.css" rel="stylesheet">
<script src="http://code.ionicframework.com/nightly/js/ionic.bundle.js"></script>


I’m using bower for my project. And in my bower.json, I already defined Ionic like so:

"ionic": null,
"ionicons": null

I’m using ‘null’ to always load the latest (I suppose, stable) version available. How would I define the ‘nightly’ release in a Bower.json file?


According to the bower repo for ionic, just run this command and you should get the nightly builds

bower install driftyco/ionic-bower#master

I don’t use bower myself, but I’m thinking about moving to it so let me know how it works out


Well instead of ‘null’ I now added ‘master’ and bower seems to be OK with that.

Still having the login button issue though… :frowning:


Hmm, what does the file say it’s version is. Maybe its not pulling the right one. The latest should be 0.10.0-alpha-1052


Is there a changelog I can check somewhere to see if there are some breaking changes between 0.9 and 0.10 before updating?

@mhartington Let’s continue the bower-related talk here:

And re-focus on this weird ass button styling :wink:


Here’s the last change log for 0.9.26


Awesome @Calendee! But updating to the latest Ionic seems to be broken when using Bower…

See: SOLVED : Bower can't install Ionic