When viewing the following HTML in Firefox, you may notice that the right and bottom border is missing. However, Chrome and Internet Explorer display it correctly. Is this a bug in Firefox, or is there another method I can use to make it look consistent across all browsers?
<!DOCTYPE html>
<html>
<head>
<style>
* {font-size:20px}
div
{
width:400px;
height:400px;
background-color:lightgreen;
border:1px solid black;
transform-origin:0 0;
-moz-transform-origin:0 0;
-ms-transform-origin:0 0;
-webkit-transform-origin:0 0;
transform:scale(0.7);
-moz-transform:scale(0.7);
-ms-transform:scale(0.7);
-webkit-transform:scale(0.7);
}
</style>
</head>
<body style='margin:10px;padding:10px'><div>Hello. This is a DIV element.</div>
</body>
</html>