CODEWITHSUNDEEP
htmlcss
UncleBen
UncleBen

Reputation: 82

HTML: Child input with width 100% is larger than fixed width parent table

I'm facing a rather strange situation..

I'm trying to make a text input fill its entire table cell, but when using width:100% on it you can see that it becomes larger than it's parent, even though no padding or margin is used.

Here's the jsfiddle: https://jsfiddle.net/ecxdkwwz/

I can see some change when applying margin:0px to the input as it actually go smaller, but it's still larger than the above div and I really wonder why.. (I'm using firefox)

Upvotes: 0

Views: 285

Answers (1)

Sunil Hari
Sunil Hari

Reputation: 1776

I just added the following css and it solved the problem

css

input[type = 'text']{
 width:100%;
 background:lightblue;
 box-shadow:none;
 text-shadow:none;
 border:none;

}

WORKING CODE:JSFIDDLE

Upvotes: 1

Related Questions