Safari 10.1 no muestra la página correctamente:

Navega tus respuestas
1

Safari 10.1 no muestra la página correctamente, en parte, y la imagen y el título que se supone que están en el medio y se muestran correctamente en Fair Fox y Chrome se muestran en el lateral de la pantalla.

Encuentro una pregunta similar en Apple Communities:

enlace

La solución sugerida es restaurar las fuentes estándar:

  

Try Applications > Font Book > File > Restore Standard Fonts

Pero no pude encontrar dónde en Applications > el Font Book File ubicado.

¿Cómo puedo encontrarlo o usarlo en otra solución para solucionar problemas de formato en Safari 10.1?

//EDITADO

<styletype="text/css">
    .pics-wrapper {           
  display: -ms-flexbox;      
  display: -webkit-flex;     
  display: flex; 
  -webkit-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

.pics-wrapper: width: 851px;

table {             
  display: -ms-flexbox;      
  display: -webkit-flex;     
  display: flex;
  -webkit-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
}

.left-pics p,
.right-pics p 
.bottom-pic p
{            
  display: -ms-flexbox;      
  display: -webkit-flex;     
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;

}

.left-pics img,
.right-pics img 
.bottom-pic img
{
  padding:2px;
}



@media (max-width:960px) {
 .left-pics p,
 .right-pics p 
 .bottom-pic p
 {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
 }
   }
    
pregunta User 31.08.2017 - 18:52

1 respuesta

1

Parece que te has topado con un error con el renderizador de Safari. Cambia el tamaño de la ventana verticalmente y la página vuelve a aparecer correctamente. Cambiar el tamaño horizontalmente y la página se extiende horizontalmente incorrectamente. Evitaría usar tablas para maquetar y seguir usando flex.

Extrae la imagen del diseño de la tabla. Reemplace lo siguiente de su código: 

<table id="Table_01" border="0" width="851" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="2">&nbsp;</td>
    <td colspan="7" rowspan="9"><img id="biggest_one" style="display: block; margin-left: auto; margin-right: auto;" src="https://www.nycgo.com/images/uploads/homepage/Empire-State-Building-Observatory-Tom-Perry-2618.jpg"alt="" width="480" height="640" name="biggest_one"
      /></td>
    <td colspan="2" rowspan="10">&nbsp;</td>
    <td><img src="photo_over/spacer.gif" alt="" width="1" height="3" /></td>
  </tr>
</table>

con lo siguiente: 

<img id="biggest_one" style="display: block; margin-left: auto; margin-right: auto;" src="https://www.nycgo.com/images/uploads/homepage/Empire-State-Building-Observatory-Tom-Perry-2618.jpg"alt="" width="480" height="640" name="biggest_one">

Luego agrega el siguiente CSS a .pics-wrapper : width: 851px; .

La solución a la que se hace referencia en su enlace (no es que solucione el problema aquí, pero es algo que pidió) es la siguiente:

  1. Abre la aplicación del libro de fuentes desde la carpeta de aplicaciones.

  2. Elija el menú Archivo seguido de Restaurar fuentes estándar.

respondido por el grg 31.08.2017 - 18:56

Lea otras preguntas en las etiquetas

¿Cómo autentico mi disco duro externo? Macbook Pro se apaga al 30% de la batería [duplicado]