Estoy tratando de agregar un iframe al lado derecho de mi página web, pero por alguna razón el iframe no se carga cuando actualizo la página. Intenté mirar mis herramientas de desarrollador en Google, pero todo lo que vi fue que había una propiedad de estilo agregada a mi iframe que dice "display: none !important". No sé si esto es lo que impide que se cargue, pero eso es todo lo que puedo pensar. Miré otras sugerencias, pero no solucionaron el problema.

Tampoco sé cómo deshacerme de la propiedad de visualización si es el problema. No tengo ningún problema de compilación. Estoy creando este sitio web con React y estoy tratando de mostrar mi cuenta de Facebook con un iframe en el lado derecho de mi página web. Realmente me vendría bien un poco de ayuda con esto. Aquí está mi código React:

 import React from 'react'; import "./Widgets.css"; function Widgets() { return ( <div className="widgets"> <iframe title="widgets" src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fprofile.php%3Fid%3D100009419984981&tabs=timeline&width=340&height=1500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="340" height="1500" scrolling="no" frameborder="0" allowfullscreen="true" style= {{ border: "none", overflow: "hidden" }} allow="encrypted-media"> </iframe> </div> ) } export default Widgets;

Captura de pantalla de los estilos que afectan al iframe: