codice:
body{
background-image: radial-gradient(gold 0%, #F0C241 10%, goldenrod 20%, #cda435 30%,goldenrod 40%,
#F0C241 50%, gold 60%, #F0C241 70%, goldenrod 80%, #cda434 90%, goldenrod 100%);
background-repeat: no-repeat; background-attachment: scroll; background-size: cover; width: 1339px; height: 1326px; margin: 10px;}
.box{
display: grid; gap: 10px; grid-template-columns: 22% 11% 34% 11% 22%;
grid-template-rows: 30% 5% 25% 25% 10% 5%; width: 1289px; height: 1276px;}
.L20{}
.L33{}
.L50{}
.L60{}
.SX, .C, .DX{border: 5px solid blueviolet; color: white; background-color: black; text-align: center; overflow: hidden;}
.SX {}
.C {}
.DX {}
h3 {}
p {}
pre {font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;}
.ParBIO{}
.DivBio{width:; height:; transition:}
.box:hover .DivBio{height:}
</style>
<body>
<div id="div1box13" class="box">
<div class="SX" class="DivBio" style="grid-column: 1/2; grid-row: 1/3;">
<h4>BIOGRAFIA</h4>
<p class="ParBIO";><pre>
lungo testo<pre><p></div>
seguono altri div e chiusura dell'html...
Spero di aver fatto bene ora.
Grazie.