CODEWITHSUNDEEP
csshtmlwidth
Ben Aston
Ben Aston

Reputation: 55729

Given the following HTML and CSS how can I get the input elment to fill the width of its parent?

HTML

<div id="container">
  <div id="first">Some text in the first div</div>
    <div id="second"><input type="text" value="Some text in the input" /></div>
  </div>
</div>

CSS

#first{
    width:100px;
    background:red;
    float:left;
}
#second{
     background:blue;
}
#container{
    overflow:hidden;
}
#container:after{
    clear:both;
    content:"";
    height:0px;
    width:0px;
    visibility: hidden;
}

Fiddle: http://jsfiddle.net/6GBts/2/

Upvotes: 0

Views: 33

Answers (1)

Sachin
Sachin

Reputation: 40970

You might want this

#second{
     background:blue;
     overflow:hidden
}

input{
  width:100%
}

Js Fiddle Demo

Upvotes: 1

Related Questions