Posizionare correttamente un div che appare dopo evento onClick gestito da JS

[Gas75]

Salve, per rendere responsive un sito web, ho necessità che un div con float right in visualizzazione pc, collocato in un div contenitore "main", non sia visibile su smartphone se non attraverso un button che cambia il valore di display da "none" e "block" attraverso un semplice if.

Sto avendo problemi nel posizionare verticalmente questo div, poiché non riesco a passare l'offset verso l'alto necessario rispetto al punto in cui appare.
La funzione, commentata, è questa...

function apriMenu() {
	var idTag = document.getElementById("destrotag"); // destrotag è il div da mostrare tramite onClick sul button apposito
	var leggiDisplay = window.getComputedStyle(idTag).display; // accedo al valore di display
	if (leggiDisplay == "none") { // se il div non si vede...
		idTag.style.display = "block"; // visualizzo il div...
		idTag.style.position = "absolute"; // cambio il tipo di posizionamento, era static nel layout pc...
		idTag.style.float = "none"; // tolgo il float che era right...
		idTag.style.width = "100%"; // lo voglio a tutta larghezza dello smartphone...
		idTag.style.padding = "0px"; // sovrascrivo il padding...
		idTag.style.top = "-" + window.getComputedStyle("titolo").getPropertyValue("height") + "px"; // nel layout pc è, assieme al div con float left, sotto al div "titolo", di cui cerco di ricavare l'altezza!
	} else if (leggiDisplay == "block") {
		idTag.style.display = "none";
	}
}

<button onClick="javascript:apriMenu();">TAG</button> <!-- nel body -->

Il problema sta nel fatto che non riesco ad accedere né all'height del div "titolo" per sottrarlo alla posizione in cui appare "destrotag", né all'height del div "header", cui dare la distanza top positiva. Entrambi questi height sono impostati su "auto" in funzione dei rispettivi width. Se assegno un valore fisso testuale a idTag.style.top, la funzione va bene, ma mi serve parametrico su uno di quegli height.
Ho provato (con poca convinzione essendo valori auto) anche con document.getElementById, con window.getComputedStyle("titolo").height, senza successo.

Il CSS di destrotag, alle varie risoluzioni è:

// base pc
#destrotag { 
	float: right;
	margin: 0px auto;
	width: 266px; 
	height: auto;
	font-size: 13px; 
	text-align: center; 
	background-color: inherit;
	text-transform: uppercase;
}

// max-width: 994px
#destrotag { 
	padding: 0px 2px 0px 2px; 
	width: 49%; 
}

// max-width: 790px (modalità in oggetto)
#destrotag { 
	display: none;
}

[Gas75]

Da JS bisogna richiamare offsetHeight!

E molte fonti spiegano che gli attributi CSS si richiamano in JS con lo stesso nome oppure togliendo i trattini e capitalizzando le iniziali...