Por lo tanto, estoy importando un iframe desde un sitio estático y tengo dificultades para ajustar la altura. (El sitio está en www.lightchan.org/blog/first ). No sé cómo establecer la altura del contenedor a la altura del contenido del iframe y ni siquiera sé si eso es posible con la forma en que lo estoy haciendo.
Aquí está el código:
<div id='blog' style=''> <div id='leftcontainer' style=''> <div v-bind:style="{ position: 'relative', paddingLeft: '25vw', width: '100vw', overflowY: 'scroll', overflowX: 'hidden', height: containerheight }"> <iframe v-bind="{ src: blogurl }" allowfullscreen frameborder="0" border="0" cellspacing="0" scrolling='no' :style="{ position:'absolute',top:'0px',width:'100%',height:containerheight }"></iframe> </div> </div> </div> </template> <style scoped> html, body{ width: calc(100% - 20px); overflow-x: hidden; position:relative; } #dblog{ margin: 20px; } #leftcontainer{ display: inline-block; float: left; } #rightcontainer{ display: inline-block; float: right; } </style> <script scoped> import app from '../App.vue' export default{ components:{ app }, data(){ return{ blogurl: 'https://lightchan.neocities.org', containerheight: '' } }, created(){ console.log('value of this.$routes.blogname', this.$route); this.blogurl = 'https://lightchan.neocities.org' + this.$route.path + '.html' console.log('value of this.blogurl: ', this.blogurl) if(this.$route.path=='/blog/first'){ this.containerheight = '150vh'; } } } </script>No es gran cosa. Simplemente se ve un poco raro a menos que me las arregle en cada publicación de blog configurando la altura en la carga. Y luego no responde muy bien cuando se cambia el tamaño de la página. Solo una cosa De todos modos, cualquier ayuda, etc., etc. Este no es muy importante, así que volveré a consultar en un momento. Gracias.