user1157393
user1157393

Reputation:

CSS Textfield padding in different browsers?

Hi I am having some trouble with the padding in a text field in different browsers. Here is a screenshot of how they look in the two different browsers. That padding is set as:

padding:8px 0 0 0;

Top one is Safari and Bottom is Chrome

Does anybody know how I can make the padding the same in most browsers?

Thanks!

Upvotes: 1

Views: 1299

Answers (3)

sandeep
sandeep

Reputation: 92803

Every browser render html differently so, Remove top padding give height to your input field & same line-height. Like this:

input{
 height:40px;
 line-height:40px;
}

It's same in all browsers

Upvotes: 2

Ryan
Ryan

Reputation: 2503

If you aren't using one already, you should be using a CSS Reset. A CSS Reset will clear the default values that various browsers apply to certain elements, which allows for a lot more consistency.

Upvotes: 2

Barry Kaye
Barry Kaye

Reputation: 7761

I doubt you'll get it perfectly right, but try and explicitly set the height, line-height and vertical-align CSS properties.

Upvotes: 1

Related Questions