Search code examples
csshtmlinternet-explorerborderinternet-explorer-11

Border of body/container not visible in IE 11


Border is visble in Chrome and Firefox but not visible in IE 11

I googled it and previously my code was border:2px solid black ; I changed it to border-style and added all the specifics in multiple lines. That did not help.

.container{
    margin:10px;
    padding:5px;
    border:2px;
    border-style:solid;
    border-color:black;
    border-radius:3px;
    text-align:center;
}

This is how it looks in Firefox

This is how it looks in IE 11


Solution

  • I'm so glad my comment worked! I was unsure so I posted it as a comment but here it is as an answer so people can accept/upvote:

    Its a weird fix but I have had borders disappear in IE and I fixed it by either adding display:block or display:inline-block to the element depending on what element it was. It is hard to offer better advice without more code to be able to reproduce your issue. This is a hack fix but microsoft will be discontinuing support for IE this year which means you will no longer have to support it as well. Our office is going to throw a party when IE support is officially over :D

    Glad it worked out for you!