[Résolu] élément audio impossible à masquer

Bonjour,

j'ai intégré une balise <audio> dans ma page web et je veux styler un lecteur from scratch avec js sans utiliser l'élément par défaut. Du coup j'ai tenté, pour masquer le lecteur de base, de faire un reset sur le style de ma balise <audio>, autrement dit :

audio{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;height:0;}

Mon problème : je n'arrive pas à annuler la hauteur. Il reste toujours un espace vide d'une 30aine de pixels qui pousse le reste de ma page vers le bas.

Ma question : y a t'il une technique pour rendre cet élément totalement invisible ?

Merci d'avance.

Salut, tu pourrais faire un jsFiddle (ou autre) pour voir ce soucis en directe live et t'aider à débuguer ? merci

J'ai trouvé une solution mais qui me paraît un peu absurde :

position:fixed;

Du coup, effectivement le lecteur passe sous le reste de la page et disparait.

Est-ce que quelqu'un aurait une solution plus "réglo" ?

et un position:absolute combiné a un top:-90000px ça solutionnerait pas ?

Salut artsx,
Merci pour ta réponse. En fait je réalise que mon problème n’apparaît que sur mobile (c'est pour un dev mobile). Du coup un jsFiddle n'aide pas (à part à me faire réaliser que mon problème est lié à webkit, et peut être seulement à iOS d'ailleurs, faut que je teste sur android).

Je mets quand mm le Fiddle à toutes fins utiles :
http://jsfiddle.net/SebChamp/G6QF3/

Je comprend pas vraiment ce que tu veux faire en faite, tu veux faire disparaitre la barre ?

SI c'est ça, utilise les media-queries pour déterminer si c'ets un mobile ou non et applique la feuille de style voulu.

Oui je voulais faire disparaitre la barre et je me suis rendu compte que cette barre n'apparaissait que sur mobile ... la solution position:fixed fonctionne bien donc on peut dire que mon problème est résolu.
Merci.