Problema muy genérico, estoy seguro, y disculpas por el título, pero no estoy seguro de cómo expresarlo.

Antecedentes: vista previa de VisualStudio 2022, .Net 4.8, ASP.Net (no Core)

índice.aspx

 <asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"> <style> iframe { position: absolute; border: solid ; border-width: 1px; box-sizing: border-box; min-width: 855px; min-height: 465px; } </style> <div class="divCanvas"> <canvas id="compass" height="230" width="230"></canvas> </div> <iframe id="if1" src="https://awebsite"> </iframe> </asp:Content>

CSS

 #compass { background: url("../images/compass2.png"); background-size: cover; vertical-align: middle; } .divCanvas { z-index:99; position:absolute; margin-left: 525px; margin-top: 70px; }

Entonces, lo que tenemos aquí es un <iframe> simple que me muestra un sitio web y usando CSS y <div> estoy superponiendo un objeto <canvas> sobre el iframe, y sí, en un lugar específico para que se superponga a un área del iframe donde Quiero que se muestre, de ahí las propiedades margin-left y margin-right .

El problema es que esto solo funciona en navegadores de escritorio (todos ellos), pero no hace nada más que mostrar el iframe en un navegador móvil (todos ellos nuevamente). ¿Qué pasó con mi <div> ?

Por cierto, el proyecto VS generó un archivo ViewSwitcher.ascx , que creo que es el problema aquí, pero no se destaca en qué parte del código sucede algo para los navegadores móviles.

¿Alguna idea por favor? ¿Debería usar el archivo ViewSwitcher de ViewSwitcher de alguna manera para mostrar mi div sobre el iframe ? En primer lugar, no tengo idea de qué está haciendo viewswitcher aquí o si es necesario.

Gracias