Beispiel:CSS-uebergross-3.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">
  <title>Textumbruch</title>
  <style>
#eins  { word-break: break-all; }
#zwei  {  -webkit-hyphens: auto; 
 hyphens: auto; 
 }

.box {
	color: #c32e04;
	font-family: Arial, Helvetica, sans-serif;
  font-size: 3em;
	font-weight: bold;
  border: medium solid black;
  padding: 3px;
  width: 150px;
}

body{
  display: grid;
  grid-template-columns: repeat(auto-fill, 16em);
}

h1 {
	grid-column: 1 / -1;
}


  </style>	
</head>
 
<body>
<h1>Textumbruch </h1>

<figure>  
	<p class="box" id="eins" lang="en">
		CSS is awesome!
	</p>
	<figcaption>word-break: break-word;</figcaption>
</figure>

<figure>  
	<p class="box" id="zwei" lang="en">
		CSS is awesome!
	</p>
	<figcaption> hyphens: auto;</figcaption>
</figure>

</body>
</html>