---
url: 'https://metadrop.net/es/articulos/ios-no-respeta-el-ancho-fijado-para-iframe'
title: 'iOS no respeta el ancho fijado para Iframe'
author: 'Cristian Aliaga'
date: '2017-01-17T09:34:17+00:00'
updated: '2026-08-04T07:56:59+00:00'
type: article
summary: 'En iOS hay un bug con los iframes que provoca que se ignore el ancho que le establecemos.'
tags:
  - 'Responsive web design'
  - Theming
  - Iframe
  - iOS
published: true
og:
  determiner: Automatic
  site_name: Metadrop
  'image:alt': 'iOS no respeta el ancho fijado para Iframe'
  street_address: 'Calle Manuel Luna, 12, 3 Dcha'
  locality: Madrid
  region: Madrid
  postal_code: '28020'
  country_name: España
  email: hola@metadrop.net
  phone_number: '910053180'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      '@type': Article
      '@id': 'https://metadrop.net/es/articulos/ios-no-respeta-el-ancho-fijado-para-iframe#article'
      name: 'iOS no respeta el ancho fijado para Iframe'
      headline: 'iOS no respeta el ancho fijado para Iframe'
      description: 'En iOS hay un bug con los iframes que provoca que se ignore el ancho que le establecemos.'
      about:
        - 'Diseño web responsivo'
        - Theming
        - Iframe
        - iOS
      datePublished: '2016-06-17T08:00:00+0200'
      dateModified: '2026-08-04T09:56:59+0200'
      author:
        '@type': Person
        name: 'Cristian Aliaga'
      publisher:
        '@type': Organization
        '@id': 'https://metadrop.net/#organization'
      mainEntityOfPage: 'https://metadrop.net/es/articulos/ios-no-respeta-el-ancho-fijado-para-iframe'
    -
      '@type': Organization
      '@id': 'https://metadrop.net/#organization'
      url: 'https://metadrop.net/'
      name: Metadrop
      sameAs:
        - 'https://www.drupal.org/metadrop'
        - 'https://twitter.com/metadrop'
        - 'https://asociaciondrupal.es/partner/metadrop'
        - 'https://www.linkedin.com/company/metadrop'
      logo:
        '@type': ImageObject
        url: 'https://metadrop.net/themes/custom/mdrop_radix/logo-metadrop-500-500.jpg'
        width: '500'
        height: '500'
    -
      '@type': ItemPage
      '@id': 'https://metadrop.net/es/articulos/ios-no-respeta-el-ancho-fijado-para-iframe'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Inicio
            item: 'https://metadrop.net/es'
          -
            '@type': ListItem
            position: 2
            name: 'Artículos expertos sobre Drupal y tecnología'
            item: 'https://metadrop.net/es/articulos'
      publisher:
        '@type': Organization
        '@id': 'https://metadrop.net/#organization'
---
 1. [Artículos](https://metadrop.net/es/articulos)
 
  

# iOS no respeta el ancho fijado para Iframe

Viernes 17 de Junio de 2016

 

 



En iOS hay un bug con los iframes que provoca que se ignore el ancho que le establecemos.



   



La principal consecuencia de este "bug" es que el iframe puede rebasar al ancho del elemento que lo contiene (un div por ejemplo), a pesar de haber configurado el ancho del iframe. 
Esto provoca que aparezca un espacio a la derecha de la web, echándo por tierra todo el responsive de la web.

Esto no ocurre siempre, solo si se cumple el siguiente requisito:
\- **El contenido de la aplicación es más ancho que el viewport disponible** (el iframe), aunque la página de dentro del iframe tenga un ancho establecido en el body del 100%.

Lo que ocurre es que si se da esta condición el navegador ignora el ancho fijado del iframe (ya sea fijo en px o variable).

## **Solución**

**Añadir css en la** **página incrustada** en el iframe:

```css
body {
  width: 1px;
  min-width: 100%;
}
```

**¿Por qué funciona?** Al establecer el ancho a 1px el ancho que interpreta el navegador nunca va a ser superior al disponible, y añadiendo el min-width evitamos que se vea con 1px de ancho.



[Diseño web responsivo](https://metadrop.net/es/articulos?text=Dise%C3%B1o%20web%20responsivo)

[Theming](https://metadrop.net/es/articulos?text=Theming)

[Iframe](https://metadrop.net/es/articulos?text=Iframe)

[iOS](https://metadrop.net/es/articulos?text=iOS)