This is a migrated thread and some comments may be shown as answers.

NumericTextBox with "display: flex;" div

2 Answers 123 Views
NumericTextBox
This is a migrated thread and some comments may be shown as answers.
Norbert
Top achievements
Rank 1
Norbert asked on 03 Sep 2014, 10:55 AM
Hi,

as upgrading from the open source core version 2014.1.318 to the new version of 2014.2.716, we encountered a small problem with the css.
Using "display: flex;" on the container DIV, the input inside it changed to a 2 row high field after calling ".kendoNumericTextBox()".

CSS:
#container{float: left; display: flex;}

HTML:
<div id="container">
   <
input id='numBox' type='number' class='' value='0'/>
 </
div>


JS:
$("#numBox").kendoNumericTextBox({
  decimals: 1,
  format: "#",
  max: null,
  min: null,
  onChange: function(e) {
    console.log(e);
  },
  spinners: true,
  step: 1
});

As you can see here: http://jsbin.com/yiwusumujino/1/edit

To solve this problem this CSS code should be added:
.k-numeric-wrap { display: flex;}

This shouldn't be handled inside Kendo UI?

Thanks,
Norbert

2 Answers, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 05 Sep 2014, 11:10 AM
Hi Norbert,

Thank you for pointed our attention to this issue - I forwarded this enquiry to the developers for further discussions and will write you back as soon as I have any information on the subject.

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Iliana Dyankova
Telerik team
answered on 09 Sep 2014, 07:47 AM
Hi Norbert,

We discussed the case and what would suggest is to wrap the input element from which the NumericTexBox is initialized into a <div> element. For your convenience here is the modified example.

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
NumericTextBox
Asked by
Norbert
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Share this question
or