HTML - La impresión de mi página no cabe en una hoja

<link rel="stylesheet" type="text/css" media="print" href="print.css">

body {width:1024px;}

body{width:700px;}

@media print {

  /* Estilos específicos para impresora */

}

@media print {

  html, body {

    height: auto;

  }

  #cuerpo {

    height: 650px;

  }

}

@media all and (min-width: 650px) and (max-width: 960px){

  /* Estilos específicos para pantalla entre 650 y 960 px */

}

<div class="botonera">

  <ul>

  <li><a href="http://elceleste.com.uy/index.html">Portada</a></li>

  <li><a target="_blank" href="http://www.facebook.com/sharer.php?u=http://www.elceleste.com.uy/deportes/HockeySCesped/130818/hockeySC130818.html">Compartir en Facebook</a></li>

  <li><a target="_blank" href="http://twitter.com/home?status=leyendo%20http://www.elceleste.com.uy/deportes/HockeySCesped/130818/hockeySC130818.html">Compartir en Twitter</a></li>

  <li><a href="javascript:window.print();%20void%200;">Imprimir</a></li>

  </ul><br>

</div>

<a href='javascript:window.print(); void 0;'>Imprimir</a>

<form>

<input type='button' onclick='window.print();' value='Imprimir' />

</form>

@CHARSET"UTF-8";

html,body{

  margin:0;

  padding:0;

  width:100%;

  height:100%;

  font-family:verdana,arial;

  overflow:hidden;

  background-color:#D2D2D2;

  color:#2D2D2D;

  font-size:0.9em;

}

#cabecera{

  height:150PX;

  padding:10px;

  background-color:#000000;

  display:block;

  color:#D2D2D2;

}

#cuerpo{

  height:820px;

  overflow:auto;

  background:#E1E1E1;

  color:#1E1E1E;

}

.botonera{

  width:220px;

  height:100%;

  float:left;

  margin: 0 auto;

  position: relative;

}

/* todo lo extenso que sea tu css de página */

@media print {

   #cuerpo { 

    color:#2D2D2D;

    font-size:0.9em;

    height: auto;

  }

  /* Si dentro de #cuerpo está tu .botonera  */

  .botonera {

    display:none;

  }

}

@media print {

	#principal{

	background-color:#666;

	width:800px;

	height: auto; /*Junto a overflow: hidden; aplicará a nuestro elemento div el mismo alto que el más alto de sus elementos hijos */

	}

	#cuerpo{

	background-color:#666;

	width:800px;

	height: auto; /*Junto a overflow: hidden; aplicará a nuestro elemento div el mismo alto que el más alto de sus elementos hijos */

	}

}

@media print {

  html, body, .principal {

    height: auto;

  }

  .cuerpo{

	height: auto;

  }

  .cabezal{

	width:0;

	display:none;

  }

  .fecha{

	width:0;

	display:none;

  }

  .organizaciones{

	width:0;

	display:none;

  }

  .amigos{

	width:0;

	display:none;

  }

  .redaccion{

	width:0;

	display:none;

  }

  .botonera{

	width:0;

	display:none;

  }

  .titularRapido{

	width:0;

	display:none;

  }

  .notaComun{

	width:42%;

	float: right;

	margin:0 auto;

  }

}

Hay elementos que interfieren y no termino de definirlos.

 De ahí que, muy convencionalmente, he podido reajustar

los contenidos en la class .notaComun y teniendo que anular otras clases.

Tratar más a fondo el tema corresponde al área de CSS ...

(lo veo como para rehacer y reordenar toda la página aunque visualmente la veas bien).