CODEWITHSUNDEEP
htmlcsslayoutonsen-ui
Jack
Jack

Reputation: 51

Onsen UI : ons-col width

I want to have two columns of - one 40% - second: 60% in onsen ui

here is my code and its not working

<ons-row>
  <ons-col size="40">Col</ons-col>
  <ons-col >Col</ons-col>
</ons-row>

i also tried with

<ons-row>
  <ons-col >Col</ons-col>
  <ons-col size="60">Col</ons-col>
</ons-row>

and 

<ons-row>
  <ons-col size="40">Col</ons-col>
  <ons-col size="60">Col</ons-col>
</ons-row>

All not working

Any help would be appreciated!

Regards

Upvotes: 0

Views: 1528

Answers (2)

Hung Tran
Hung Tran

Reputation: 815

Why don't you use width: 40%?

<ons-row>
    <ons-col width="40%">I'm 40%</ons-col>
    <ons-col>I'm 60%</ons-col>
</ons-row>

Codepen: http://codepen.io/tranduyhung/pen/pvJjZB

Upvotes: 0

Riad
Riad

Reputation: 3860

It should be something like this:

<ons-row>
 <ons-col width="50px">Col</ons-col>
 <ons-col >Col</ons-col>
</ons-row>

Upvotes: 1

Related Questions