I think that there is an bug because they does not support flexgrid and css grid. Here is my example and test this in the new browser Google Chrome and Firefox not the result in CSS grid
Can you please supported the css properties flex grid layout and css grid layout?
This is my code from the HTML Editor v16.0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
<meta name="dcterms.created" content="wo, 21 feb 2018 08:33:29 GMT">
<meta name="description" content="">
<meta name="keywords" content="">
<title></title>
<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
.hero-grid {
display: grid;
grid-template-columns: auto;
grid-template-rows: auto 80px 80px auto;
width: 98%;
margin-right: auto;
margin-left: auto;
background-color:#FF80C0;
}
@media screen and (min-width: 64rem) {
.hero-text-wrapper {
grid-column: 1 / 5;
grid-row: 1 / 2;
.hero-image {
grid-column: 2 / 4;
grid-row: 2 / 3;
.middle {
grid-column: 3 / 5;
width: 100%;
.back {
grid-column: 1 / 3;
width: 100%;
}
}
</style>
</head>
<body>
<section class="hero-section">
<div class="hero-grid">
<div class="hero-text-wrapper">
<h2 class="hero-text creative">
create
</h2>
<h2 class="">
lorum
</h2>
<h2 class="">
ipsum
</h2>
</div>
<!-- Nog niet van toepassing
<picture>..</picture>
<picture>..</picture>
<picture>..</picture>
-->
</section>
</body>
</html>
Toekomstgerichte door ICT gebeten IT'er
Stephane Fonteyne
Ba. Elektronica - ICT
Application Software PowerBasic Developer
e-mail : stephane.fonteyne@telenet.be
gmail : stephane760126@gmail.com
linkin : in : <http://www.linkedin.com/pub/stephane-fonteyn/53/402/204>
twitter : @Stefke36
Stephane Fonteyne
Ba. Elektronica - ICT
Application Software PowerBasic Developer
e-mail : stephane.fonteyne@telenet.be
gmail : stephane760126@gmail.com
linkin : in : <http://www.linkedin.com/pub/stephane-fonteyn/53/402/204>
twitter : @Stefke36
