Fixed width column size css

1

I’m trying to make two columns in a pane (with side menus additional) The first column is fixed width(contains some nav icons), the second column should take up the remaining space.

I’ve done this by adding the style “flex:0 0 70px;” to the first column, and it works perfectly on my desktop browsers.

On ipad browsers (both safari and chrome[27.0.1453.10]) I get two 50% columns instead.

A very simple .html file shows that the respected property in both ipad browsers should be: style=“display: -webkit-flex;”

2

Resolved this by adding a new selector (copied from the ionic.css col-33 selector) to my ionic.app.scss:
col-70px {
-webkit-box-flex: 0;
-webkit-flex: 0 0 70px;
-moz-box-flex: 0;
-moz-flex: 0 0 70px;
-ms-flex: 0 0 70px;
flex: 0 0 70px;
max-width: 70px; }

2 Likes