|
|
| Line 24: |
Line 24: |
| | } | | } |
| | | | |
| − | .hexagon .face1,
| |
| − | .hexagon .face2 {
| |
| − | position: absolute;
| |
| − | top: 0;
| |
| − | left: 0;
| |
| − | width: 100%;
| |
| − | height: 100%;
| |
| − | overflow: hidden;
| |
| − | background: inherit;
| |
| − | z-index: -1;
| |
| − | /* Keeps borders smooth in webkit */
| |
| − | backface-visibility: hidden;
| |
| − | }
| |
| − | .hexagon .face1:before,
| |
| − | .hexagon .face2:before {
| |
| − | content: '';
| |
| − | position: absolute;
| |
| − | width: 220px;
| |
| − | height: 220px;
| |
| − | background: inherit;
| |
| − | }
| |
| − |
| |
| − | .hexagon .face1 { transform: rotate(60deg); }
| |
| − | .hexagon .face1:before {
| |
| − | left: 0;
| |
| − | transform-origin: left top;
| |
| − | transform: rotate(-60deg) translate(-110px, 0);
| |
| − | }
| |
| − |
| |
| − | .hexagon .face2 { transform: rotate(-60deg); }
| |
| − | .hexagon .face2:before {
| |
| − | right: 0;
| |
| − | transform-origin: right top;
| |
| − | transform: rotate(60deg) translate(110px, 0);
| |
| − | }
| |
| | | | |
| | #row{ | | #row{ |