boh
boh

Reputation: 1547

CSS Width is not as shown in the console

I am extending a project which uses Twitter Bootstrap. I set the width of my input textbox to be 260px. The css width property is not crossed over in Chrome inspector and is correctly shown 260px, but its actual width is 270px. When I change the width in my stylesheet to 270px, its real width becomes 280px and so on. What can possibly be the causes?

Upvotes: 0

Views: 78

Answers (3)

user2404546
user2404546

Reputation:

check from the metrics view of the chrome inspector. It'll show the padding and the width being applied to your input.

set padding:0 if neccessary

Upvotes: 1

z1m.in
z1m.in

Reputation: 1661

You need to use box-sizing: border-box;

Upvotes: 1

slash197
slash197

Reputation: 9034

You have padding on your input, set it to 0px.

Upvotes: 2

Related Questions