Fixer un <aside>

Bonjour,

Je suis en train de coder mon site et je m'attaque en ce moment au responsive pour le mobiles. Pour cela j'ai arrangé un menu (dans une <aside>) qui apparaît sur le côté gauche quand on appuie sur une icone hamburger. Tout marche dans mon menu sauf un truc: je n'arrive pas à fixer le menu pour qu'il soit visible n'importe où sur la page. J'avait essayé position:fixed mais mon menu a tout simplement disparut ! et il n'est visible q'avec position:absolute.
Voici le-dit menu:

Et voici son HTML:

<aside class="menu_mobil_hidden">
	<a id="cross_button">
	        <div class="hamburger_close" id="cross"></div>
	</a>
	<ul id="menu_ul_mobil">
		<a href="#" rel="nofollow noopener noreferrer" target="_blank" class="menu_link">
			<li class="item_mobil" style="border-top: 1px solid white;">
				<b>ACCUEIL</b>
			</li>
		</a>	
		<a href="#" rel="nofollow noopener noreferrer" target="_blank" class="menu_link">
			<li class="item_mobil">
				<b>COMPÉTENCES</b>
			</li>
		</a>
		<a href="#" rel="nofollow noopener noreferrer" target="_blank" class="menu_link">
			<li class="item_mobil">
				<b>CRÉATIONS</b>
			</li>
		</a>
		<a href="#" rel="nofollow noopener noreferrer" target="_blank" class="menu_link">
			<li class="item_mobil">
				<b>CONTACT</b>
			</li>
		</a>
	</ul>
</aside>

Le CSS:

.menu_mobil {
	position: absolute;
	top:0;
	padding-top: 0;
	padding-left: 0;
	width: 200;
	height: 100%;
	display: inline-block;
	background-color: #2C82C9;
	box-shadow:  0 0 10px rgba(0, 0, 0, 0.5);
	color: white !important;
	text-decoration: none;
	text-align: center;
	z-index: 1900;
	transform: translateX(0px);
	transition: all 0.4s ease-out;
}

Merci de m'aider à fixer ce menu pour qu'il suive le scroll de l'utilisateur