Strange blue border in MapView of ArcGIS JS 4

Starting from ArcGIS JS 4.x, under some special conditions, the MapView will have a blue border when the MapView is focus, who genius get this geneless idea?

To get rid of this stupid box, style the following:

.esri-view-surface--inset-outline::after {   
    outline: none !important;
    padding: 0px !important;
}

So when this stupid design will come out? When ever your HTML got the following conditions, that stupid box will be shown when MapView is on focus:

body {
    margin: 0;
} 

#mapDiv {
    width: 100%
}

... The most weird API ever encountered

Change font size by language using CSS

Quick useful when browser render text with different size in different languages:

html:lang(en) h1{
    font-size: 20px;
}

html:lang(ko) h1{
    font-size: 10px;
}

Reference: http://stackoverflow.com/questions/15267355/change-font-size-based-on-language

3D translate an element in HTML

To translate the element, you need:

1. A container having CSS style "perspective: ___px"
2. The actual element having CSS style "transform: rotateX(___deg)"

Sample:

<div style="perspective:500px; margin-left:100px;">
    <div style="transform: rotateX(40deg)">
        <table border=1>
            <tr><td>testing</td><td>testing</td><td>testing</td></tr>
            <tr><td>testing</td><td>testing</td><td>testing</td></tr>
            ...
            <tr><td>testing</td><td>testing</td><td>testing</td></tr>
            <tr><td>testing</td><td>testing</td><td>testing</td></tr>
    </table>                
    </div>
</div>

testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing
testing	testing	testing	testing	testing

100% Height DIV

The trick is to set body with height:100% in CSS:

<style>
   html, body {
      margin: 0px;
      height: 100%;
   }
</style>

Then DIV's CSS height:100% will work !