Div class="col-80" doesn't work on android


I have a row with 3 columns which use respectively the classes col-10, col-80 and col-10. It works fine on the browser, but on Android the second column is 0 wide.
As a result the button on the third column is attached to the first column, instead of being on the right of the screen like in the browser. How could I fix my problem?

<div class = "row">
   <div class ="col-10">
    {{  event.hh    }}:{{  event.mm}}
   <div class="col-80 center">

   <div class ="col-10 text-right">

       <button class="button button-dark" 
      <i class="icon ion-edit"></i>


I believe you have to have col class in front of those, according to the docs. Try it out? It might make a difference or add an attribute. Also, what browser are you using and have you tried this on iOS?

If you make a code pen of this issue you can try it in the regular android browser too and that will give you some more insight

<div class="row">
  <div class="col col-10">
    {{ event.hh }}:{{ event.mm }}

  <div class="col col-80 center">


  <div class="col col-10 text-right">
    <button class="button button-dark">
      <i class="icon ion-edit"></i>


Hmm it also renders fine in Safari. Though the codepen isn’t wrapped in an ion-view or ion-content and that could change how it’s working.

What version of android did you see the issue on?


Sorry, the problem was due the missing col in front as you first wrote.


Haha, I’m glad it’s fixed though.

Positioning problems are my least favorite haha.