ionic - input box width - html

Question

I am having a problem with the input boxes in my login.html. I am not able to increase the width of the input boxes. If I am increasing the width to 100%, the height is increasing with it.
Here is an image showing the width.
I want the width to be almost double of it.
Here is a link to my html and css:
https://jsfiddle.net/ybkjv8uw/
item.item-input {
border: none;
position: relative;
left: 0px;
top: 135px;
background-color: transparent;
}

Answer 1

.item.item-input {
border: none;
position: relative;
top: 135px;
background-color: transparent;
width:100%;
}
.item.item-input>span{
width:auto;
}
.item.item-input>input{
width:68%;
}

Answer 2

.view-content {
background-color:#85b818;
}
.img-div {
position: relative;
left: 110px;
top: 35px;
}
.item.item-input {
border: none;
position: relative;
left: 0px;
top: 135px;
background-color: transparent;
width:100%;
}
.item.item-input span{width:auto;}
.item.item-input input{width:68%;}
/*.item-input-inset .item-input-wrapper input {
padding-left: 4px;
height: 29px;
background: transparent;
line-height: 18px;
// you should add the following:
box-sizing: border-box;
width: 100%;
}*/
input::-webkit-input-placeholder {
color: white;
}
label {
/*display: block; width: 100%;*/
width:200px;
float: left;
/*clear:left;*/
text-align:right;
/*padding-right:10px;*/
}
input{
/*float:left;*/
}
.enter-div {
text-align: center;
}
.enter-button {
position: relative;
top: 170px;
width: 280px;
height: 50px;
border-radius: 25px;
border: none;
background-color: green;
color: white;
}
.foyopass-div {
position: relative;
text-align: center;
top: 200px;
color: white;
}
<ion-view class="view-content">
<div class="img-div">
<img src="img/main_logo_icon.png" style="width : 40% ; height : 20%" >
</div>
<div>
<label class="item item-input">
<span class="input-label" ><img src="img/email_icon.png" style="width: 30%" ></span>
<input type="email" placeholder="Email">
</label>
</div>
<div>
<label class="item item-input">
<span class="input-label" ><img src="img/password_icon.png" style="width: 25%"></span>
<input type="password" placeholder="Password">
</label>
</div>
<div class="enter-div">
<button class="enter-button">
Enter
</button>
</div>
<div class="enter-div">
forgot your password?
</div>
</ion-view>