CODEWITHSUNDEEP
cssfirefoxcross-browser
Adam Gilly
Adam Gilly

Reputation: 59

How to apply max-width style for Firefox/IE/Chrome

I am using the css style max-width:236px which produces exact view for chrome/IE but not in Firefox. In order to produce the same thing for Firefox I need to give max-width:219px; in this case IE/chrome is not working. How can I give the two different values in max-width properties for cross browser issue. Your suggestions are valuable. Thank you.

// IE/Chrome is good
textboxwidth {
  max-width: 236px;
}

// FireFox is good
textboxwidth {
  max-width: 219px;
}

Upvotes: 0

Views: 462

Answers (1)

Tyler Roper
Tyler Roper

Reputation: 21672

Add box-sizing: border-box; to your style.

Firefox's default TextBox includes more padding than IE/Chrome. box-sizing: border-box; changes the width to include padding, as opposed to the standard method of adding the two together to get absolute width.

EDIT: Paulie_D posted the same answer in the comments above, just to give additional credit where it's due.

Upvotes: 2

Related Questions