HerrZatacke/unknown_artist.html

## unknown_artist.html
<!doctype html>
<html lang="de">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
  <title>Unbekannter Künstler</title>
  <style type="text/css">
    * {
      font-family: Arial;
    }

    textarea,
    input {
      border: none;
      display: inline-block;
      resize: none;
    }

    form {
      margin: 100px;
      width: 300px;
      height: 200px;
      border: 1px dotted #ccc;
      padding: 40px 35px 0 35px;

      transform: scale(1.2) translate(20%, 100%);
    }

    #artist {
      display: block;
    }

    #artist,
    #title,
    #date,
    .comma {
      font-size: 16px;
    }

    #artist,
    #title,
    .comma {
      width: auto;
      font-weight: bold;
    }

    #artist {
      margin-bottom: 4px;
    }

    #title {
      font-style: italic;
    }

    #material {
      margin: 14px 0;
      font-size: 12px;
    }

    #longdes {
      font-size: 9px;
    }

  </style>
</head>
<body>

<form>
<div contenteditable id="artist">Unbekannter Künstler</div>
<span contenteditable="" type="text" id="title">Erinnerung</span><span class="comma">,</span>
<span contenteditable="" type="text" id="date">November 2018</span>
<div contenteditable id="material">Skulptur, Fleischmischprodukt in Semmel</div>
<div contenteditable id="longdes">Das Objekt soll den Betrachter an das übermäßige Vorhandensein von Lebensmitteln in der Kulturregion Bayern erinnern.</div>
</form>

</body>
</html>
	<!doctype html>
	<html lang="de">
	<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
	<title>Unbekannter Künstler</title>
	<style type="text/css">
	* {
	font-family: Arial;
	}

	textarea,
	input {
	border: none;
	display: inline-block;
	resize: none;
	}

	form {
	margin: 100px;
	width: 300px;
	height: 200px;
	border: 1px dotted #ccc;
	padding: 40px 35px 0 35px;

	transform: scale(1.2) translate(20%, 100%);
	}

	#artist {
	display: block;
	}

	#artist,
	#title,
	#date,
	.comma {
	font-size: 16px;
	}

	#artist,
	#title,
	.comma {
	width: auto;
	font-weight: bold;
	}

	#artist {
	margin-bottom: 4px;
	}

	#title {
	font-style: italic;
	}

	#material {
	margin: 14px 0;
	font-size: 12px;
	}

	#longdes {
	font-size: 9px;
	}

	</style>
	</head>
	<body>

	<form>
	<div contenteditable id="artist">Unbekannter Künstler</div>
	<span contenteditable="" type="text" id="title">Erinnerung</span><span class="comma">,</span>
	<span contenteditable="" type="text" id="date">November 2018</span>
	<div contenteditable id="material">Skulptur, Fleischmischprodukt in Semmel</div>
	<div contenteditable id="longdes">Das Objekt soll den Betrachter an das übermäßige Vorhandensein von Lebensmitteln in der Kulturregion Bayern erinnern.</div>
	</form>

	</body>
	</html>