item item-input：css样式，删除框中的空格答案

【问题标题】：item item-input: css styling, remove space in boxitem item-input：css样式，删除框中的空格
【发布时间】：2016-10-10 09:54:26
【问题描述】：

我是 ionic、HTML 和 css 的新手。但我设法做了一个简单的网络应用程序。但我无法正确设置项目输入类的样式。我搜索了很多论坛，但没有找到正确的解决方案。

我想获得 2 个输入字段，看起来像时钟：“时间：：” 大多数情况下，我无法删除每个输入字段右侧的填充（或边距）。这是一个屏幕截图：

[编辑]对不起...忘记密码...

<label class="item item-input">          
        <span>Time </span>
        <input type="tel" maxlength='2' name="hour" min="0" max="23" ng-model="alarm.hour">
        <span> : </span>
        <input type="tel" maxlength='2' name="minute" min="0" max="59" ng-model="alarm.minute">
      </label>
      <br/>

      <ion-scroll zooming="false" direction="y" style = "width: 320px; height: 8000px">
        <div ng-repeat="setpoint in alarm.setpoints track by $index">
        <div class = "scroll-container"></div>
          <label class="item item-input">
            <span class="input-label">{{chName[$index]}}</span>
            <input type="tel" name="room" min="5" max="35" step="0.5" ng-model="alarm.setpoints[$index]">&#186;C
          </label>
        </div>
      </ion-scroll>

我在温度输入上遇到了同样的填充问题，摄氏度符号向右偏移......

【问题讨论】：

创建任何代码 sn-p ，没有人能用你的截图给出想法
我一直在寻找解决方案。对 ionic.css item-input 进行了一些故障排除以确定可能导致它的功能，我发现显示：-webkit-box;并显示：-webkit-flex 可能是原因。但我不知道我能做些什么来解决它。

标签： css ionic-framework

【解决方案1】：

终于，我找到了该怎么做。 ionic 使用 flex 来设置应用程序的样式。对于像我这样遇到麻烦的新手，这个视频教程对我有很大帮助： flex tutorial

此外。我发现了另一个带有 ion-slides 和 scrool 的错误，它会产生一些奇怪的 css 问题。解决方案非常简单：我只需添加另一个 'ion-content' 标签

<ion-view view-title="programs">
  <ion-content padding="true" >      
    <ion-slides  options="options" slider="data.slider">
      <ion-slide-page ng-repeat="alarm in alarms">
        <ion-content>    <!-- that's the add -->
          <div class="list">

【讨论】：