Foros del Web » Creando para Internet » CSS »

Visualización y alineación en diversos navegadores

Estas en el tema de Visualización y alineación en diversos navegadores en el foro de CSS en Foros del Web. Hola a todos: Vaya por delante que me declaro un completo analfabeto en cuanto a diseño web. Acabo de subir una página que he hecho ...
  #1 (permalink)  
Antiguo 12/12/2011, 03:36
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Visualización y alineación en diversos navegadores

Hola a todos:

Vaya por delante que me declaro un completo analfabeto en cuanto a diseño web.

Acabo de subir una página que he hecho con un programa de Flash. Este te exporta a un html+swf, que es el que he puesto en mi página: www.miguelarmentia.com

Mi problema es que en mi navegador, aparece una barra de scroll horizontal en la parte de abajo, lo que imagino que se deberá a que habrá algún problema con la alineación. Además en IE no se ve y en Opera y muchos otros parece que tampoco (estoy probando ahora mismo con www.browsershots.org).

Supongo que gran parte de los problemas de visualización se deberán a que la página es una película flash, que seguro que es una de las peores formas de hacer una página web. El caso es que empecé a hacerla probando el programa Swish y cuando me quise dar cuenta, había metido ya muchas horas y no quería liarme la manta con otro programa. Como digo en mi perfil: "Mi primera página fue bochornosa. La segunda más aparente, pero muy mejorable. Para la tercera juro que contrataré un profesional".

Por tanto, si se puede hacer algo para mejorar la alineación/visualización de la web en los navegadores más utilizados (mozilla, ie y chrome, supongo) y no es muy costoso, os agradecería mucho vuestra ayuda.

Por si os ayuda, pego debajo el código del index.html. Disculpad la parrafada y gracias por adelantado.

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html40/loose.dtd">
<html>
  <head>
    <title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="author" content="MRA">
    <meta name="generator" content="SWiSH Max4 (2010.11.02) www.swishzone.com">
    <meta name="description" content="">
    <meta name="keywords" content="1, 100, 15, 24, 34, 622, Abstracts, Case Reports, Clinical trials , Custom, Disabled, Drug registration, Events, How do I work?, How...?, Informed Consents, Labels, Loading, MSDS, Market Research, Marketing text, Medical devices, PILs, Papers, Patents, Patient questionnaires, Previous, SPCs, Surveys, Text, Training materials, Websites, What do I offer?, What have
clients said
about me, What...?, Where to find me?, Where...?, Who am I?, Who...?, Why choose me?, Why...?, about, abroad, academic, accept, accepting, account, again, agencies, agency, ago, agreements, always, amazing, any, as, assure, availability, average, before, biochemist, biochemistry, biologist, both, bound, business, but, button, by, can, cancer, cannot, care, changes, choose, click, client, clients, collaborate, com, command, comments, companies, complexity, confidentiality, consider, contact, curriculum, customer, dedicated, degree, degrees, delivered, detail, details, developed, didn’t, different, direct, document, during, edit, editor, educational, efficiently, end, english, environmental, excellent, experience, extremely, feedback, ff, field, fields, finally, find, for, french, further, future, get, ground, health, high, himself, home, hope, hours, how, impressed, in, industry, info, information, is, job, just, know, knowledge, language, languages, left, less, let, life, like, linguistic, linkedin, loading, long, look, mainly, make, many, master, mean, medical, medicine, meticulous, miguel, miguelarmentia, million, minutes, more, mother, my, myText, mytext, names, native, not, notch, offer, only, oriented, out, over, part, percent, perfect, periods, pharmaceutical, please, pleasure, plesure, preferential, priority, professional, profile, projects, project’s, proofread, prostate, proved, provide, proz, publish, quality, range, read, real, regulatory, reliable, response, reviewers, sample, satisfaction, say, science, sciences, scientific, section, seriously, services, several, silence, sincerely, skills, skype, solid, spanish, specialized, specific, standards, started, studied, studies, success, sure, take, teacher, team, texts, thank, thanks, that, that’s, their, then, they, this, time, tongue, top, touch, training, translate, translated, translation, translations, translator, twitter, types, used, various, volume, way, ways, website, well, will, with, words, work, worked, working, writing, year, years, your">
<style type="text/css">
/*<![CDATA[*/
*
{
    margin: 0;
    padding: 0;
    height: 100%;
}
object
{
    vertical-align: top;
}
/*]]>*/
</style>
  </head>
  <body bgcolor="#FFFFFF">
    <center>
      <object
        classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
        codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
        id="index"
        width="1024" height="768"
      >
        <param name="movie" value="index.swf">
        <param name="bgcolor" value="#FFFFFF">
        <param name="quality" value="high">
        <param name="seamlesstabbing" value="false">
        <param name="allowscriptaccess" value="samedomain">
        <embed
          type="application/x-shockwave-flash"
          pluginspage="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
          name="index"
          width="1024" height="768"
          src="index.swf"
          bgcolor="#FFFFFF"
          quality="high"
          seamlesstabbing="false"
          allowscriptaccess="samedomain"
        >
          <noembed>
          </noembed>
        </embed>
      </object>
    </center>
  </body>
</html>
  #2 (permalink)  
Antiguo 12/12/2011, 03:39
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

Sólo quería comentar que he intentado antes solucionar el problema sumergiéndome en el foro, pero las soluciones eran concretas para cada caso y no lograba sacar ninguna conclusión dado mi absoluto "analfabetismo webdesignil".
  #3 (permalink)  
Antiguo 20/12/2011, 20:05
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

Primero no tiene que ver con la alineación sino con el tamaño del mismo
(no excedas los 1000 o 1005px).
Segundo te recomiendo exportar solo el swf y usar este código para insertarlo donde quieras.

Remplaza los nombres, anchos, altos, urls y quita el
<param name="wmode" value="transparent" />
y el
wmode="transparent"

si no quieres que el fondo se vea transparente

<center><object id="nombre" width="ancho" height="alto" classid="nombre">
<param name="wmode" value="transparent" />
<param name="src" value="url.swf" />
<embed id="nombre" width="ancho" height="alto" type="application/x-shockwave-flash" src="url.swf" wmode="transparent" />
</object></center>

el tuyo quedaría así

<center><object id="index" width="990" height="768" classid="index">
<param name="wmode" value="transparent" />
<param name="src" value=".index.swf" />
<embed id="index" width="990" height="768" type="application/x-shockwave-flash" src="index.swf" wmode="transparent" />
</object></center>


luego cúentame como te fue

Última edición por madhatterdef; 20/12/2011 a las 20:59
  #4 (permalink)  
Antiguo 22/12/2011, 05:11
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

¡¡¡¡Gracias!!!!

Voy a ver si tengo tiempo de hacerlo antes de que termine la semana y te comento.

¡Felices fiestas!
  #5 (permalink)  
Antiguo 22/12/2011, 14:05
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

De nada ojala te sirva e igualmente
  #6 (permalink)  
Antiguo 27/12/2011, 05:00
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

Hola:

Parece que ahora ya funciona mejor la página. De todos modos sigue sin verse en Internet Explorer. No sé si esto tendrá un "arreglo" fácil. Si no, me parece que la voy a dejar así.

Muchas gracias de nuevo por tu respuesta, madhatterdef. De no ser por ti, no habría retomado el asunto.

¡Saludos!
  #7 (permalink)  
Antiguo 27/12/2011, 06:21
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: Visualización y alineación en diversos navegadores

El tema del scroll, ya te lo señalaron, por otro lado el flash está mal insertado, usá este método
http://www.forosdelweb.com/f4/faqs-h...ml#post3474113

Para evitar problemas en explorer, tenés que usar un Doctype Válido, podrías usar

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #8 (permalink)  
Antiguo 27/12/2011, 14:43
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

Seguro la idea era solucionar los dos problemas

había olvidado remarcar el ultimo "url.swf"

prueba así

<center><object id="nombre" width="ancho" height="alto" classid="nombre">
<param name="wmode" value="transparent" />
<param name="src" value="url.swf" />
<embed id="nombre" width="ancho" height="alto" type="application/x-shockwave-flash" src="url.swf" wmode="transparent" />
</object></center>

tiene dos de todo para eso uno para ie y el otro para firefox

escribiendo solo eso en un archivo html funciona en ambos

si quieres pon tu código completo y tratare de arreglarlo
  #9 (permalink)  
Antiguo 27/12/2011, 16:36
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: Visualización y alineación en diversos navegadores

Cita:
Iniciado por madhatterdef Ver Mensaje
Seguro la idea era solucionar los dos problemas

había olvidado remarcar el ultimo "url.swf"

prueba así

<center><object id="nombre" width="ancho" height="alto" classid="nombre">
<param name="wmode" value="transparent" />
<param name="src" value="url.swf" />
<embed id="nombre" width="ancho" height="alto" type="application/x-shockwave-flash" src="url.swf" wmode="transparent" />
</object></center>

tiene dos de todo para eso uno para ie y el otro para firefox

escribiendo solo eso en un archivo html funciona en ambos

si quieres pon tu código completo y tratare de arreglarlo
No hace falta utilizar los dos, con esto
http://www.forosdelweb.com/f4/faqs-h...ml#post3474113
es suficiente

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #10 (permalink)  
Antiguo 28/12/2011, 05:50
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

Al ver bien eso note que con esto bastaria

<center><object type="application/x-shockwave-flash" data="url.swf" width="ancho" height="alto"> <param name="nombre" value="url.swf"/> <param name="wmode" value="transparent" /></object></center>

Última edición por madhatterdef; 28/12/2011 a las 09:09
  #11 (permalink)  
Antiguo 29/12/2011, 03:40
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

Lo intentaré de nuevo cuando vuelva al trabajo. ¡Gracias de nuevo por los consejos, los aprecio realmente!
  #12 (permalink)  
Antiguo 29/12/2011, 10:39
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

De nada. Bueno si aún no te funciona solo vuelve a preguntar.
  #13 (permalink)  
Antiguo 29/12/2011, 11:06
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: Visualización y alineación en diversos navegadores

Cita:
Iniciado por madhatterdef Ver Mensaje
Al ver bien eso note que con esto bastaria

<center><object type="application/x-shockwave-flash" data="url.swf" width="ancho" height="alto"> <param name="nombre" value="url.swf"/> <param name="wmode" value="transparent" /></object></center>
@madhatterdef, sería bueno, que revises atentamente la info antes de sugerir código, ya que si no podemos estar confundiendo a los demás usuarios.
En el post con el ejemplo de código para insertar Flash 100% compatible y xhtml válido, dejé un link a una demo, con lo cual quedan despejadas todas las dudas en cuanto al funcionamiento, sin embargo, al insertar tú código de ejemplo ponés

Código HTML:
Ver original
  1. <param name="nombre" value="url.swf" />

un parámetro de name=nombre no representa nada en la inserción del swf, lo correcto es
Código HTML:
Ver original
  1. <param name="movie" value="url.swf" />
justamente el parámetro movie es el que va a permitir la visualización en IE (pequeño detalle, verdad?)

Gracias y Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #14 (permalink)  
Antiguo 30/12/2011, 18:05
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

Cierto. Tratare de hacerlo mejor la próxima vez

Miguelrdez te pido disculpas por tu tiempo

Emprear solo trataba de simplificar y explicar mejor tu código ya que a vista de un principiante parece muy complicado.
Recién ahora veo el link del demo. Aun así me parece que no todos los principiantes serán capaces de ver el código fuente y entenderlo correctamente. (Podrías haberte explicado mejor).

El código correcto sería este.

<center><object type="application/x-shockwave-flash" data="url.swf" width="ancho" height="alto"> <param name="movie" value="url.swf"/> <param name="wmode" value="transparent" /></object></center>

Perdón por la tardanza y los errores cometidos.
  #15 (permalink)  
Antiguo 30/12/2011, 19:59
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: Visualización y alineación en diversos navegadores

vos me estás tomando el pelo, mi código está ahi
http://www.forosdelweb.com/f4/faqs-h...ml#post3474113
correctamente explicado y funcionando

vos te apareces con esto
Código HTML:
Ver original
  1. <center><object id="nombre" width="ancho" height="alto" classid="nombre">
  2.  <param name="wmode" value="transparent" />
  3.  <param name="src" value="url.swf" />
  4.  <embed id="nombre" width="ancho" height="alto" type="application/x-shockwave-flash" src="url.swf" wmode="transparent" />
  5.  </object></center>
que está mal, despues cambias por esto
Código HTML:
Ver original
  1. <center><object id="nombre" width="ancho" height="alto" classid="nombre">
  2.  <param name="wmode" value="transparent" />
  3.  <param name="src" value="url.swf" />
  4.  <embed id="nombre" width="ancho" height="alto" type="application/x-shockwave-flash" src="url.swf" wmode="transparent" />
  5.  </object></center>
que tambien está mal
finalmente lo haces como se debe, utilizando la forma correcta que te mencioné...
pero eso no basta, sentencias:
Cita:
Emprear solo trataba de simplificar y explicar mejor tu código ya que a vista de un principiante parece muy complicado.
Si esta es tu forma de simplificar las cosas, mal camino estás llevando, dejá de confundir. Seguro que @miguelrdez lo va a saber entender mejor que vos, y si no, preguntará nuevamente y le despejaré cualquier duda

__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #16 (permalink)  
Antiguo 30/12/2011, 20:27
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

Emprear si bien tuve errores en el proceso me parece que este código

<object type="application/x-shockwave-flash" data="b.swf" width="400" height="300">
<param name="movie" value="b.swf" />
<param name="loop" value="false" />
<param name="menu" value="true" />
<param name="play" value="true" />
<param name="bgcolor" value="#8897db" />
<p>Flash Player no se encuentra o la versión no es compatible, utiliza el siguiente link para ir a la página de descarga <br />
<a href="http://get.adobe.com/es/flashplayer/" onclick="this.target='_blank'">Descargar Flash Player</a>
</p>
</object>

No es igual que este

<center><object type="application/x-shockwave-flash" data="url.swf" width="ancho" height="alto" wmode="transparent"> <param name="movie" value="url.swf"/> <param name="wmode" value="transparent" /></object></center>

(a pesar de utilizar el mismo metodo).

Y que a simple vista tu código no es muy comprensible (para un principiante).

Igualmente agradezco que me corrigieras vuelvo a pedir perdón a miguelrdez y te pido perdón a vos en caso de haberte ofendido.


Última edición por madhatterdef; 31/12/2011 a las 00:58
  #17 (permalink)  
Antiguo 31/12/2011, 15:07
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

miguelrdez como modo de conclusión te digo que puedes usar cualquiera de los dos códigos:

el dado por emprear

<object type="application/x-shockwave-flash" data="b.swf" width="400" height="300">
<param name="movie" value="b.swf" />
<param name="loop" value="false" />
<param name="menu" value="true" />
<param name="play" value="true" />
<param name="bgcolor" value="#8897db" />
<p>Flash Player no se encuentra o la versión no es compatible, utiliza el siguiente link para ir a la página de descarga <br />
<a href="http://get.adobe.com/es/flashplayer/" onclick="this.target='_blank'">Descargar Flash Player</a>
</p>
</object>

o el dado por mi

<center><object type="application/x-shockwave-flash" data="url.swf" width="ancho" height="alto" wmode="transparent"> <param name="movie" value="url.swf"/> <param name="wmode" value="transparent" /></object></center>

en ambos casos tu código especifico seria este

<object type="application/x-shockwave-flash" data="index.swf" width="100%" height="100%">
<param name="movie" value="index.swf" />
<param name="loop" value="false" />
<param name="menu" value="true" />
<param name="play" value="true" />
<param name="bgcolor" value="#ffffff" />
<p>Flash Player no se encuentra o la versión no es compatible, utiliza el siguiente link para ir a la página de descarga <br />
<a href="http://get.adobe.com/es/flashplayer/" onclick="this.target='_blank'">Descargar Flash Player</a>
</p>
</object>

o

<center><object type="application/x-shockwave-flash" data="index.swf" width="100%" height="100%" wmode="transparent"> <param name="movie" value="index.swf"/> <param name="wmode" value="transparent" /></object></center>

devuelta te pido perdón por tu tiempo y los errores cometidos

no creo que tengas más problemas luego cuenta como te fue
  #18 (permalink)  
Antiguo 10/01/2012, 11:56
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

¡Hola!

Gracias de veras a los dos por vuestra ayuda. Al final he dejado una mezcla de los dos códigos y estoy satisfecho con el resultado. Me explico: con uno de los exploradores (creo recordar que con Mozilla) he tenido problemas para ver la página con los "100%", así que he utilizado 400x300.

Muchas gracias a los dos de nuevo, ahora ya se visualiza en IE.

¡Buena tarde!
  #19 (permalink)  
Antiguo 10/01/2012, 11:58
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

Ahora en mi firefox, chrome se ve perfecto, aunque en IE un poco pequeñito. De todos modos, así me vale. Lo del 100% me parecía perfecto, pero no sé por qué demonios no funcionaba en Firefox.

Bueno, para ser una chapucilla personal, no está tan mal
  #20 (permalink)  
Antiguo 10/01/2012, 22:04
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

Me alegro de que te allá funcionado

yo lo probé en Firefox y el 100% me anda

(me refiero a este código

<center><object type="application/x-shockwave-flash" data="url.swf" width="100%" height="100%" wmode="sparent"> <param name="movie" value="url.swf"/> <param name="wmode" value="transparent" /></object></center>

)

si quieres pon tu código y te ayudo a ver que paso

me olvidaba agrégale este css para que no te deje márgenes

body {
margin: 0px;
padding: 0px;
}
  #21 (permalink)  
Antiguo 10/01/2012, 23:10
Avatar de madhatterdef  
Fecha de Ingreso: diciembre-2011
Ubicación: argentina
Mensajes: 213
Antigüedad: 12 años, 11 meses
Puntos: 59
Respuesta: Visualización y alineación en diversos navegadores

ya está ya vi tu problema usa esto en el css

html,body {
margin: 0;
padding: 0;
height: 100%;
}
  #22 (permalink)  
Antiguo 11/01/2012, 04:39
 
Fecha de Ingreso: diciembre-2011
Ubicación: Bilbao
Mensajes: 8
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Visualización y alineación en diversos navegadores

¡Muchas gracias madhatterdef! Ahora se ve perfectamente en todos mis navegadores y en los ordenadores de la gente que he probado.

Gracias. Con esto, podemos dar por cerrado el hilo.

Etiquetas: chrome, html, navegadores
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 11:37.