centrar iframe

[AitorLopez]

Hola amigos, tengo este codigo

<div class="entry-content">
<p>
<iframe width.........>
</iframe
</p>
</div>


.entry-content p iframe{text-align:center;}

Lo que quiero es dentrar el iframe, pero al ejecutar el codigo, no me aplica la regla.

¿Me sabeis decir porque puede ser?

Gracias. Un saludo.

[emprear]

Centrar el iframe donde?
en el body?
dentro del div que lo contiene?
horizontalmente, verticalmente?

lo segundo no tiene mucha lógica ya que no estás definiendo ninguna medida, si es lo primero lo que tenes que centrar es la capa que contiene el iframe no el iframe dentro de un párrafo (parrafo que por otra parte no se sabe muy bien para que esta.

Medio como adivinando te diría

.entry-content{
margin: 0 auto;
}

[AitorLopez]

Hola. Gracias por responderme.

Ya se que la estructura es un poco rara, pero es como la pone wordpress, por eso me tengo que adaptar a ella.

Dicho esto, te comento. Dentro del entry-content, puede haber texto, iframes o lo que sea, pero no quiero centrarlo siempre, quiero centrarlo solo cuando halla iframes, es decir, en base a este codigo:

<div class="entry-content">
<p>
Aqui vendria el texto
</p>
</div>

No quiero centrarlo.

pero en base a este codigo:

<div class="entry-content">
<p>
<iframe width.........>
</iframe
</p>
</div>

Si quiero centrarlo.

Espero haberme explicado bien.

Gracias.

[emprear]

A ver, esta regla
.entry-content p iframe{text-align:center;}
esta bien a medias, por un lado es correcto, va a afectar al iframe, si hay otro contenido no, la mitad que no es correcta es que el tag iframe está para que en el cargues otro html con el atributo src, y el align center jamás va a afectar ese contenido, tendrías que modificar el css del archivo que se carga en ese iframe, se entiende.

si le haces esto a un iframe
iframe{
text-align:center;
margin-left: 200px;
}

te va a tomar el margin, pero no va a centrar el contenido
Saludos

[AitorLopez]

Ya, pero ese archivo css no puedo modificarlo, por eso quería hacer referencia a la regla completa hasta el iframe, todo lo que vaya dentro del iframe no puedo tocarlo.

[AitorLopez]

De todas formas, se me ocurre lo siguiente. El parrafo si consigo centrarlo, el tema es ver si hay alguna forma de decirle cuando tenga

.entry-content p

y despues venga un iframe, que centre lo de dentro.

¿Esto es posible hacerlo?.

Un saludo.

[edwardd89]

margin:0 auto;

[AitorLopez]

Hola, eso centra todo, yo solo quiero centrar los parrafos que lleven un iframe dentro

[kseso?]

Una etiqueta /p/ no debería ser el contenedor de ningún iframe (ni de otros elementos de bloque tal que div´s, ul,...)
Así que lo mejor que puede hacer es modificar esa parte.

Y lo que sigue está repetido hasta la saciedad en estos foros. Pereza de no molestarse en buscarlo o no querer entenderlo:
Si quiere centrar un elemento de bloque debe definirle unas medidas inferiores a su contenedor y añadir el famoso "margin: 0 auto". Así que búsquese el cómo darle en sus estilos una anchura a su iframe.

Text-align está parac entrar los contenidos de una etiqueta, nunca para centrar a la propia etiqueta en su contenedor padre. Que hace años que ya se aclaró el porqué y en cuál navegador era funcional para evitar un fallo garrafal de quien hacía la página (ie6 en ausencia de doctype).

[AitorLopez]

Hola, hablando de perezosos, debería haber leido todos los post de este hilo. Si lo hubiera hecho, su primer parrafo escrito y la mitad del segundo se los podría haber ahorrado.

Por lo demas, gracias por la respuesta. Con su explicación, haré algunas pruebas a ver si soy capaz poner en funcionamiento lo que explicado.

Un saludo.

[kseso?]

Parece que tenemos que retomar lo básico de css.
Veamos si lo consigo.

En su html generado:
Tiene un contenedor con clase /entry-content/
en su interior, sin importar la profundidad a la que se encuentra, tiene un /iframe/

Para poder referenciarlo en el css sólo tiene que crear la regla correspondiente declarar las propiedades necesarias.
Que le repito, si quiere centrarlo defina tamaño y margen.
Le invito a probar el sguiente código:

Código HTML:

<head>
<meta charset="UTF-8">
<title>Kseso? jugando con css</title>
<style type="text/css">
* {
  margin:0; padding:0; position: relative;
}
.entry-content iframe {
  width: 80%;
  margin: 0 auto;
  border: none;
  background: red;
  display: block;
}
</style>    
</head>
<body>
    <div class="entry-content">
          <iframe>
          </iframe>          
    </div>
</body>
</html>
 

Ain olvidar añadir el doctype que crea conveniente.

Y sí, sigo pensando lo mismo de todo el que pregunta a estas alturas cómo centrar en la horizontal:

Y lo que sigue está repetido hasta la saciedad en estos foros. Pereza de no molestarse en buscarlo o no querer entenderlo

Sólo espero que el código propuesto sea el final.

[AitorLopez]

Hola Kseso?. He estado probando lo tu codigo y funciona perfectamente como tu decias.

Gracias por tu ayuda. Un saludo.

[limpiezadirect]

Odios los iframes, pueden ocultar perfectamente código que te pise las css por y donde quieran.