-3

I have a div container with height and width specified [say, width=280px & height=30px]. The div contains a textbox [input type=text] with css attributes: box-sizing=border-box & width=100% I've placed two div containers adjacent and expect that, there should be spacing between the textboxes.

This works just fine in Chrome and Mozilla. But, Microsoft Edge spreads the textbox to the entire div and there's no space between the adjacent text boxes. I doubt, the box-sizing is not considered by Edge and hence the full width is used ? Please advise.

BrainStorm03
  • 7
  • 4
  • Had to remove previous comment, link didn't work. `box-sizing: border-box` is supported just fine by Edge. See: https://caniuse.com/#feat=css3-boxsizing Without an example, it's difficult to say what else could be causing the problem. – Lewis Dec 02 '19 at 14:54
  • Please check [this article](https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing), the box-sizing support Edge 12+, you could try to add the vendor prefix: -webkit-, like this `-webkit-box-sizing: border-box;`. If still not working, can you post the Enough code to reproduce the problem as in [Minimal, Complete, and Verifiable example](https://stackoverflow.com/help/mcve). – Zhi Lv Dec 02 '19 at 15:34

1 Answers1

0

Use this -webkit-box-sizing: border-box; to support all browsers