Software Archive
Read-only legacy content
17061 Discussions

Ionic using app designer - Row "Space between columns" always 20px

David_G_4
Novice
505 Views

I am building using ionic framework set up through Intel XDK/App designer.

For some reason I am no longer able to change the css parameter in Row "Space between columns".  It stays at 20px no matter what I do.  I attempted to manually change this in index_main.less.css and it works but as soon as anythings changes in the app designer is overwrites this back to 20px.

Note:  I think when I first started the app I was able to change this.  Some widget I added must make it not work anymore.

Does anybody know why?  Or is there a custom css I can add that will override this?  (For some reason adding stuff like margin: 0px; doesn't work.

0 Kudos
2 Replies
Chris_P_Intel
Employee
505 Views

Do you have the latest version of the XDK? I cannot reproduce this behavior.  When I set the space between columns it stays set. And as I move from row to row, or widget to widget and then come back, it is correctly parsed out.  0px works for me. 

You have multiple columns, I presume?  If you want to govern the spacing _around_ the row, modify its grid-pad style.

Never modify the main.less.css file. It has a warning stating such at the top of the file.  That file is generated from main.less.  If you want to make a lasting change to the CSS, make it in main.less or one of the files it includes.

Also, remember that CSS cascades and later rules override earlier ones (for the same specificity). So you can always add your own overrides.css file and bind in in _after_ main.less.css.  Anything you put in there will take precedent (subject to CSS selector application precedent logic).

 

0 Kudos
David_G_4
Novice
505 Views

I do have the latest version of XDK.

Yeah, I see that warning now in the main.less.css.  Noted.

I ended up just taking your last suggestion and added an overrides.css.  That worked great.  Thanks.

0 Kudos
Reply