Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Dr. Stranho

[Resolvido] CCS para FF no Linux # Windows

Por , em Desenvolvimento frontend

Recommended Posts

Dr. Stranho    0

Dr. Stranho
Postado

Galera,

Embuti um banner em flash no meu site ( http://www.portalmultiplo.com.br ), mas o mesmo aparece de forma diferente para cada SO.

Se eu alinhar o banner no FF usando Linux, o mesmo aparece "torto" no FF do Windows.

Tentei fazer uns racks em CSS pra cada Browser, mas não consegui fazer para SO diferentes.

No momento deixei alinhado para todos os Browsers Windows, pq quase todo mundo acessa usando windows (quem pena).

Dá um força aí galera.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dr. Stranho    0

Dr. Stranho
Postado

Primeiramente,

Obrigado Ted K e Thiago por estarem ajudando em pleno final de semana prolongado.

Vamos por parte:

 

Aqui o index.php com o rack que fiz pro IE7

#### index.php ###

<!--[if IE 7]>
<style>
#banner_multiplo {
	width: 930px;
	height: 150px;
	position: center;
	border: 7px solid #053455;
	margin: 0;
	padding: 0px 0 0;
	margin-left: 32px;
}
</style>
<![endif]-->


<div id="banner_multiplo">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
 codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
 WIDTH="930" HEIGHT="150" id="indexbanners" ALIGN="">
 <PARAM NAME=movie VALUE="images/flash/multiplo.swf"> <PARAM NAME=wmode VALUE="transparent" /><PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#FFFFFF> <EMBED src="images/flash/multiplo.swf" quality=high bgcolor=#FFFFFF  WIDTH="930" WMODE="transparent" HEIGHT="150" NAME="indexbanners" ALIGN=""
 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>
</div>

Aqui o CSS

### template.css ###
/* Banner_Mult */
#banner_multiplo {
	width: 930px;
	height: 150px;
	border: 7px solid #053455;
	margin: 0;
	padding: 0px 0 0 0;
	margin-left: 32px;
}

E aqui o print do FF no Linux. Não vou postar do Windows porque em todos os browsers Windows aparece normal.

Imagem Postada

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago Retondar    18

Thiago Retondar
Postado

Vamos lá... Não tenho como testar no Windows agora mas creio que dessa maneira que vou lhe indicar irá funcionar em ambos browsers. ^_^

 

Na div pai - com id="ja-wrapper" - coloque um width: 956px e um margin: 0 auto. Isso irá fazer com que o site fique centralizado e tenha maior controle sobre seu conteúdo.

 

Na div#banner_multiplo tire aquele valor margin e coloque 0 auto, ficando margin: 0 auto.

 

Acho que assim que você quer que fique.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

2Flex    1

2Flex
Postado

Olá,

 

Acho que com o que o nosso amigo falou vai dar certo ;).

 

Outra coisa que reparei agora:

<!--[if IE 7]>
<style>
#banner_multiplo {
        width: 930px;
        height: 150px;
        position: center;
        border: 7px solid #053455;
        margin: 0;
        padding: 0px 0 0;
        margin-left: 32px;
}
</style>
<![endi
Penso que não exista position: center :o.

Veja essa situação.

 

Cumprimentos

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dr. Stranho    0

Dr. Stranho
Postado

Obrigado Thiago pelas informações.

Também não uso windows. Estou baixando um ISO light do XP pra subir numa máquina virtual.

Assim que estiver rodando aqui eu posto os resultados.

 

[]'s

Dr. Stranho

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dr. Stranho    0

Dr. Stranho
Postado

Bem, baixei o XP e subi a máquina virtual, fiz as alterações, mas ficou na mesma. Porém, acho que o problema sou eu que não sei fazer essas alterações.

Thiago, eu fiz assim:

Coloquei logo abaixo da div ja-wrapper, isso no index.php

<style>
<div id="ja-wrapper" <?php echo $mainbg;?>>
#banner_multiplo {
	width: 956px;
	border: 7px solid #053455;
	margin: 0 auto;
	padding: 0px 0 0;
	margin-left: 32px;
}
</style>
era isso mesmo, no index.php?

 

e no template.css

/* Banner_Mult */
#banner_multiplo {
	width: 930px;
	height: 150px;
	border: 7px solid #053455;
	margin: 0 auto;
	padding: 0px 0 0 0;
	margin-left: 32px;
}

cara, me desculpe se to fazendo bobagem, mas é pq não manjo muito dessas coisas e não é a toa que estou aqui pedindo ajuda :)

 

Mas o "pior" vem agora. O banner em flash não estava alinhado no Windows, ele aparecia correto no Windows pq a minha máquina virtual estava com a resolução de 1024 x 768.

 

Aí, fazendo vários teste hoje, fui alterar a resolução da máquina virtual para 1152 x 864 e pronto, vi que até no Windows tava errado o banner. Na verdade, tá a mesma coisa do Linux, eu sempre soube que o Linux era melhor :)

 

Segue abaixo duas telas do FF no Linux (mas o erro é o mesmo no Windows).

A primeira mostra a janela do FF ocupando quase todo meu Desktop. Lembro que meu Linux está com a resolução de 1208 x 960.

Imagem Postada

 

Na segunda imagem, eu simplesmente reduzi o tamanho da janela do FF, na margem esquerda. Observe que o banner veio junto, dando a impressão que está alinhado.

Imagem Postada

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago Retondar    18

Thiago Retondar
Postado

Vamos lá... Dê uma olhada nesses links tópicos, vão te ajudar a ter uma maior noção do CSS http://forum.imasters.com.br/public/style_emoticons/default/seta.gif http://forum.imasters.com.br/index.php?/forum/180-laboratorio-de-scripts-ws/

 

Coloquei logo abaixo da div ja-wrapper, isso no index.php

<style>
<div id="ja-wrapper" <?php echo $mainbg;?>>
#banner_multiplo {
        width: 956px;
        border: 7px solid #053455;
        margin: 0 auto;
        padding: 0px 0 0;
        margin-left: 32px;
}
</style>

Não... tente sempre colocar em arquivos externos e não se coloca tag dentro de style, apenas indicadores. Assim:

 

#banner_multiplo {
        width: 956px;
        border: 7px solid #053455;
        margin: 0 auto;
        padding: 0px 0 0;
        margin-left: 32px;
}

Você atualizou o site, certo? Antes tinha o uma div#ja-wrapper que englobava tudo, agora não tem.

 

De uma estudada no link que eu te passei e tente alterar algumas coisas no CSS.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dr. Stranho    0

Dr. Stranho
Postado

Estou lendo o link q você enviou.

Você atualizou o site, certo? Antes tinha o uma div#ja-wrapper que englobava tudo, agora não tem.

 

Não atualizei o site, só fiz as alterações que você me passou acima.

A div#ja-wrapper só existia (e ainda existe) no index.php. Procurei por essa div no template.css e ela nunca existiu lá.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dr. Stranho    0

Dr. Stranho
Postado

Thiago, consegui resolver.

Como falei, eu não manjo muito dessas coisas, então fui na base tentativa erro.

No index.php, parte do rack do IE7, inseri o margin: 0 auto; conforme você disse e retirei a linha margin-left: 32px;

<!--[if IE 7]>
<style>
#banner_multiplo {
        width: 930px;
        height: 150px;
        position: center;
        border: 7px solid #053455;
        margin: 0 auto;
        padding: 0px 0 0;
}
</style>
<![endif]-->
e ainda no index.php, onde estava <div id="banner_multiplo">, mudei para <div align="center" id="banner_multiplo">. Ou seja, centralizei toda a div do flash.

<div align="center" id="banner_multiplo">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
 codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
 WIDTH="930" HEIGHT="150" id="indexbanners" ALIGN="">
 <PARAM NAME=movie VALUE="images/flash/multiplo.swf"> <PARAM NAME=wmode VALUE="transparent" /><PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#FFFFFF> <EMBED src="images/flash/multiplo.swf" quality=high bgcolor=#FFFFFF  WIDTH="930" WMODE="transparent" HEIGHT="150" NAME="indexbanners" ALIGN=""
 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>
</div>

No template.css, também alterei o margin: 0; para margin: 0 auto; e retirei a linha margin-left: 32px;

/* Banner_Mult */

#banner_multiplo {

	width: 930px;
	height: 150px;
	border: 7px solid #053455;
	margin: 0 auto;
	padding: 0px 0 0 0;
}
No <div id="ja-wrapper" <?php echo $mainbg;?>> eu deixei como tava originalmente.

 

Valeu Thiago e muito obrigado a todos que de alguma forma ajudaram.

[]'s

Dr. Satrnho

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito