Esempio 2 Box Model

by Davide Caruso

HTML

<!DOCTYPE html>
<html>
<head>
	<title>Esempio 2 Box Model</title>
	<meta charset="utf-8">
	<meta name="viewport" content="widtd=device-widtd, initial-scale=1, minimum-scale=0.3, maximum-scale=3.0, user-scalable=no">
	<style>
	.BodyFormat
	{
		font-family: "Segoe UI",calibri, arial,helvetica;
		font-size: 18px;
		font-weight: normal;
		color: #2c0e10;
		background-color: #f8f6e6;
	}

	.ClsContainer
	{
		margin: 0 auto;
		overflow: hidden;
		width: 850px;
		min-height: 100%;
	}

	.ClsCenter
	{
		text-align: center;
	}

	.ImgContainer
	{
		text-align: center;
	}

	.ImgContainer p
	{
		margin-top: 0px;
	}

	li
	{
		padding-bottom: 5px;
	}

	.ClsBoxSX
	{
		float: left;
		width: 32%;
	}

	.ClsBoxSX img
	{
		width: 100%;
	}

	.ClsBoxCX
	{
		float: left;
		width: 32%;
		margin-left: 18px;
	}
	.ClsBoxCX img
	{
		width: 100%;
	}

	.ClsBoxDX
	{
		float: right;
		width: 32%;
	}
	.ClsBoxDX img
	{
		width: 100%;
	}
	</style>
</head>
<body class="BodyFormat">
<!--Inizio DvContainer -->
<div id="DvContainer" class="ClsContainer">

<p class="ClsCenter">BISTECCA ALLA FIORENTINA </p>

<p class="ClsCenter"><b>Ingredienti:</b> 1 bistecca da un kg, Olio extravergine di oliva, Sale, Pepe</p>

<p></p>
<div class="ImgContainer">
	<div class="ClsBoxSX">
		<img src="https://www.caruso.link/Davide/Esempi/ImgRicetta2.png">
		<p>Fase 1</p>
	</div>

	<div class="ClsBoxCX">
		<img src="https://www.caruso.link/Davide/Esempi/ImgRicetta3.png">
		<p>Fase 2</p>
	</div>

	<div class="ClsBoxDX">
		<img src="https://www.caruso.link/Davide/Esempi/ImgRicetta4.png">
		<p>Fase 3</p>
	</div>
</div>

<p><b>Procedimento: </b></p>

<ol>
	<li>Un paio d'ore prima della cottura togliere la bistecca alla fiorentina dal figo e tamponarla.</li>
	<li>Disporre la carne sulla griglia ben calda e cuocere per un tempo compreso tra i 3 e i 5 minuti,
		in base allo spessore della carne, senza mai girarla e controllandola spesso.</li>
	<li>Girare la bistecca e cuocete nella stessa modalitĂ  e per lo stesso tempo, senza mai...