Centralizando Slide

Qual é sua questão:
Bom...

Coloquei um Slide no Portal do meu Forum através de um widget, mas queria centralizar ele dentro do widget. Não achei onde encaixar ele para que o Slide ficasse centralizado corretamente. O código é esse:

Código:

<style type="text/css">

#tv a {
font-size:16px;
font-weight:bold;
}

#tv span {
color:#FFFFFF;
font-size:12px;
font-weight:normal;
}

#hid {
display:none;
left:-5000px;
position:absolute;
top:-5000px;
}

#tv #nav {
height:170px;
left:359px;
overflow:hidden;
position:absolute;
top:5px;
width:46px;
}

#tv #nav img {
cursor:pointer;
height:30px;
margin:0 0 5px;
width:46px;
}

#tv .opac {
margin-bottom:5px;
opacity:1;
}

#tv .transp {
margin-bottom:5px;
opacity:0.1;
}


#tv img {
display:block;
margin-bottom:7px;
margin-left:-10px;
border:thin solid;
}
img {
border:medium none;
}

#tv {
background:url("http://i55.tinypic.com/dmw3ue.png") no-repeat scroll 0 0 transparent;
float:left;
height:255px;
overflow:hidden;
padding:0 61px 0 10px;
position:relative;
width:344px;
}

#corpoh {
text-align:left;
}

</style><div id="tv">
<script type='text/javascript'>
// JavaScript para tv //
var index = 1; var menu_time = 6000; var anterior = 5; var timer = setTimeout('trocaMsg()',menu_time);
function trocaMsg() { index = index%5 +1; channel(index); tempo(); }
function tempo() { clearTimeout(timer); timer = setTimeout("trocaMsg()",menu_time);}
function channel(id) { index = id; document.getElementById("tvn" + anterior).className= "transp"; document.getElementById("tvn" + id).className = "opac"; document.getElementById('tvshow').innerHTML=document.getElementById('tv' + id).innerHTML; anterior = id;}
function tvch(id, out) {if (out == 1) { clearTimeout(timer); channel(id);} else { tempo();}}
//channel(1);




// JavaScript para tv-papeis //
var index_p = 1; var menu_time_p = 2800; var anterior_p = 5; var timer_p = setTimeout('trocaMsg_p()',menu_time_p);
function trocaMsg_p() { index_p = index_p%5 +1; channel_p(index_p); tempo_p(); }
function tempo_p() { clearTimeout(timer_p); timer_p = setTimeout("trocaMsg_p()",menu_time_p);}
function channel_p(idx) { index_p = idx; document.getElementById("tvp" + anterior_p).className= "transp"; document.getElementById("tvp" + idx).className = "opac"; document.getElementById('paptv').innerHTML=document.getElementById('ptv' + idx).innerHTML; anterior_p = idx;}
function tvch_p(idx, out) {if (out == 1) { clearTimeout(timer_p); channel_p(idx);} else { tempo_p();}}
//channel_p(1);

//Função p/ n Aparecer erro de JS no navegador do Tiozinho
function semerro(){
return true;}
window.onerror=semerro;

</script><div id="tvshow">

<!-- SLIDE INICIAL-->

<a href="http://topdesign.forumeiros.com/t763-resultado-sotw-5?t=1303346009="177" width="354" src="http://topdesign.forumeiros.com/t702-votacao-sotw-5" title="Fernando Lou" />

eleiçoes 2012


<span>
Em 2012 Vote Com o Coraçao

</span></a></div><div id="nav">

<!-- SLIDE DE NAVEGAÇÕES // escolher o slide a ser visto-->

<!-- SLIDE DE NAVEGAÇÃO 1-->

<a href=" "><img height="30" width="46" onmouseout="tvch(1,0)" onmouseover="tvch(1,1)" src="http://i56.tinypic.com/24muwq0.png" class="transp" id="tvn1" /></a>

<!-- SLIDE DE NAVEGAÇÃO 2-->

<a href=" "><img height="30" width="46" onmouseout="tvch(2,0)" onmouseover="tvch(2,1)" src="http://i52.tinypic.com/289flp5.png" class="opac" id="tvn2" /></a>

<!-- SLIDE DE NAVEGAÇÃO 3-->

<a href=" "><img height="30" width="46" onmouseout="tvch(3,0)" onmouseover="tvch(3,1)" src="http://i51.tinypic.com/jqnp7o.png" class="transp" id="tvn3" /></a>

<!-- SLIDE DE NAVEGAÇÃO 4-->

<a href=" "><img height="30" width="46" onmouseout="tvch(4,0)" onmouseover="tvch(4,1)" src="http://i53.tinypic.com/5303n4.png" class="transp" id="tvn4" /></a>

<!-- SLIDE DE NAVEGAÇÃO 5-->

<a href="http://elementdowns.blogspot.com/search/label/hacker"><img height="30" width="46" onmouseout="tvch(5,0)" onmouseover="tvch(5,1)" http: / /www.asupr.com /asureport /wp-content /uploads /2008 /10 /hacker1.jpgclass="transp" id="tvn5" /></a>
</div>


<ul id="hid">

<!-- SLIDES-->

<!-- SLIDE 1-->

<li id="tv1">
<a href="http://i783.photobucket.com/albums/yy117/Kagamin_IzumiChan/TakeruSuGsotw.png?t=1303346009"><img height="177" width="354" src="http://i783.photobucket.com/albums/yy117/Kagamin_IzumiChan/TakeruSuGsotw.png?t=1303346009" title="SOTW " />

#SOTW 5


<span>

   Vencedora : Y u u ki'

</span></a></li>


<!-- SLIDE 2-->

<li id="tv2">
<a href=" "><img height="177" width="354" src="http://i54.tinypic.com/1zqr4uf.jpg" title="WOTW" />

#WOTW

<span>

   Ainda sem resultados
</span></a></li>

<!-- SLIDE 3-->

<li id="tv3">
<a href=" "><img height="177" width="354" src="http://i54.tinypic.com/1zqr4uf.jpg" title="TDFS" />

#TDFS

<span>

   Ainda sem resultados
</span></a></li>

<!-- SLIDE 4-->

<li id="tv4">

<a href=" "><img height="177" width="354" src="http://i54.tinypic.com/1zqr4uf.jpg" title="AOTM" />

#AOTM


<span>

   Ainda sem resultados
</span></a></li>

</ul>


<script type="text/javascript">
channel(1);
</script>
</div>

Alguem poderia me dizer onde colocar para que centralize ?


Grato desde já!

Que medidas você tomou para corrigir o problema:
essa

Apresente-nos imagens do problema (se necessário):
não necessita

Olá!

É só colocar o código abaixo antes de todos os códigos:

Código:

<center>

e adicionar este no final de todos os códigos:

Código:

</center>

Resolve?

Melhores cumprimentos,
seender

Não funciona. Já usei o comando "Left e right" de um código HTML e não deu certo, o center não funciona com Slides.

Olá,

Tente este código:

Código:

<div align="center">AQUI CODIGO</div>

Obrigado pela ajuda, mas infelizmente nenhum funcionou =/

Amigo, esse codigo foi postado por mim e no meu funciona normal. te mandei uma mP. abraçoss

Ele está funcionando normalmente, já editei e tudo, mas só quero uma coisa: Centralizar ele, apenas isso.

Olá Caíque!

Bom vou lhes explicar o problema de seu código que não permite centralizar.
Você utilizou o "float:left;" que faz o box ser jogado para a esquerda, assim sendo este código superior aos outros mostrados acima, que funcionariam se este float não existisse!

A tag <center> funciona sim, mas ela foi abolida das tags oficiais do HTML atual, de acordo com as normas.
Então uma solução, seria colocar um alinhamento com CSS, lembrando que este tipo de alinhamento só funciona se você especificar a largura do objeto.

Fazemos assim:

<style>
#obj{width:100px;margin: 0 auto;}
</style>

<div id="obj">asd</div>

Isso centraliza o objeto na tela, ele cria uma margem lateral o quanto for suficiente para preencher os espaços aos lados.

Mas como existe o IE6, este código não funciona nele, pois ele não obedece as normas dos códigos estabelecidas pela W3C.

Então usamos um "erro" do IE6 para funcionar, criamos mais uma div, colocamos a largura dela em 100%, e então colocamos o "align:center" que pelas regras de CSS deveria funcionar sómente para texto, o que não acontece no IE6 e 7:

<style>
.ie6{width:100%;align:center;}
#obj{width:100px;margin: 0 auto;}
</style>

<div class="ie6">
<div id="obj">asd</div>
</div>

Bom, esse "textão" foi para futuras dúvidas semelhantes, o seu código pronto para ser centralizado está aqui:

Código:

<style type="text/css">

#tv a {
font-size:16px;
font-weight:bold;
}

#tv span {
color:#FFFFFF;
font-size:12px;
font-weight:normal;
}

#hid {
display:none;
left:-5000px;
position:absolute;
top:-5000px;
}

#tv #nav {
height:170px;
left:359px;
overflow:hidden;
position:absolute;
top:5px;
width:46px;
}

#tv #nav img {
cursor:pointer;
height:30px;
margin:0 0 5px;
width:46px;
}

#tv .opac {
margin-bottom:5px;
opacity:1;
}

#tv .transp {
margin-bottom:5px;
opacity:0.1;
}


#tv img {
display:block;
margin-bottom:7px;
margin-left:-10px;
border:thin solid;
}
img {
border:medium none;
}

#tv {
background:url("http://i55.tinypic.com/dmw3ue.png") no-repeat scroll 0 0 transparent;
height:255px;
overflow:hidden;
padding:0 61px 0 10px;
position:relative;


width:344px;
margin: 0 auto;
}

#corpoh {
text-align:left;
}

</style>


<div id="tv">
<script type='text/javascript'>
// JavaScript para tv //
var index = 1; var menu_time = 6000; var anterior = 5; var timer = setTimeout('trocaMsg()',menu_time);
function trocaMsg() { index = index%5 +1; channel(index); tempo(); }
function tempo() { clearTimeout(timer); timer = setTimeout("trocaMsg()",menu_time);}
function channel(id) { index = id; document.getElementById("tvn" + anterior).className= "transp"; document.getElementById("tvn" + id).className = "opac"; document.getElementById('tvshow').innerHTML=document.getElementById('tv' + id).innerHTML; anterior = id;}
function tvch(id, out) {if (out == 1) { clearTimeout(timer); channel(id);} else { tempo();}}
//channel(1);




// JavaScript para tv-papeis //
var index_p = 1; var menu_time_p = 2800; var anterior_p = 5; var timer_p = setTimeout('trocaMsg_p()',menu_time_p);
function trocaMsg_p() { index_p = index_p%5 +1; channel_p(index_p); tempo_p(); }
function tempo_p() { clearTimeout(timer_p); timer_p = setTimeout("trocaMsg_p()",menu_time_p);}
function channel_p(idx) { index_p = idx; document.getElementById("tvp" + anterior_p).className= "transp"; document.getElementById("tvp" + idx).className = "opac"; document.getElementById('paptv').innerHTML=document.getElementById('ptv' + idx).innerHTML; anterior_p = idx;}
function tvch_p(idx, out) {if (out == 1) { clearTimeout(timer_p); channel_p(idx);} else { tempo_p();}}
//channel_p(1);

//Função p/ n Aparecer erro de JS no navegador do Tiozinho
function semerro(){
return true;}
window.onerror=semerro;

</script><div id="tvshow">

<!-- SLIDE INICIAL-->

<a href="http://topdesign.forumeiros.com/t763-resultado-sotw-5?t=1303346009="177" width="354" src="http://topdesign.forumeiros.com/t702-votacao-sotw-5" title="Fernando Lou" />

eleiçoes 2012


<span>
Em 2012 Vote Com o Coraçao

</span></a></div><div id="nav">

<!-- SLIDE DE NAVEGAÇÕES // escolher o slide a ser visto-->

<!-- SLIDE DE NAVEGAÇÃO 1-->

<a href=" "><img height="30" width="46" onmouseout="tvch(1,0)" onmouseover="tvch(1,1)" src="http://i56.tinypic.com/24muwq0.png" class="transp" id="tvn1" /></a>

<!-- SLIDE DE NAVEGAÇÃO 2-->

<a href=" "><img height="30" width="46" onmouseout="tvch(2,0)" onmouseover="tvch(2,1)" src="http://i52.tinypic.com/289flp5.png" class="opac" id="tvn2" /></a>

<!-- SLIDE DE NAVEGAÇÃO 3-->

<a href=" "><img height="30" width="46" onmouseout="tvch(3,0)" onmouseover="tvch(3,1)" src="http://i51.tinypic.com/jqnp7o.png" class="transp" id="tvn3" /></a>

<!-- SLIDE DE NAVEGAÇÃO 4-->

<a href=" "><img height="30" width="46" onmouseout="tvch(4,0)" onmouseover="tvch(4,1)" src="http://i53.tinypic.com/5303n4.png" class="transp" id="tvn4" /></a>

<!-- SLIDE DE NAVEGAÇÃO 5-->

<a href="http://elementdowns.blogspot.com/search/label/hacker"><img height="30" width="46" onmouseout="tvch(5,0)" onmouseover="tvch(5,1)" http: / /www.asupr.com /asureport /wp-content /uploads /2008 /10 /hacker1.jpgclass="transp" id="tvn5" /></a>
</div>


<ul id="hid">

<!-- SLIDES-->

<!-- SLIDE 1-->

<li id="tv1">
<a href="http://i783.photobucket.com/albums/yy117/Kagamin_IzumiChan/TakeruSuGsotw.png?t=1303346009"><img height="177" width="354" src="http://i783.photobucket.com/albums/yy117/Kagamin_IzumiChan/TakeruSuGsotw.png?t=1303346009" title="SOTW " />

#SOTW 5


<span>

  Vencedora : Y u u ki'

</span></a></li>


<!-- SLIDE 2-->

<li id="tv2">
<a href=" "><img height="177" width="354" src="http://i54.tinypic.com/1zqr4uf.jpg" title="WOTW" />

#WOTW

<span>

  Ainda sem resultados
</span></a></li>

<!-- SLIDE 3-->

<li id="tv3">
<a href=" "><img height="177" width="354" src="http://i54.tinypic.com/1zqr4uf.jpg" title="TDFS" />

#TDFS

<span>

  Ainda sem resultados
</span></a></li>

<!-- SLIDE 4-->

<li id="tv4">

<a href=" "><img height="177" width="354" src="http://i54.tinypic.com/1zqr4uf.jpg" title="AOTM" />

#AOTM


<span>

  Ainda sem resultados
</span></a></li>

</ul>


<script type="text/javascript">
channel(1);
</script>
</div>

Espero ter ajudado Caíque!
Byte

Olá ja tentou o Código HTML que Seender lhe passou?

Se Seender não se encomodar vou repetir oque ele disse.

Use este código HTML:

Código:

<center>Código do Slide Aqui</center>


Ao Começar:

Código:

<center>

Ao Terminar:

Código:

</center>

Pelo menos aqui a Tag <center> ainda esta funcionando.
Em meu Slide que eu usava funcionava não sei agora,se eu estiver errado me desculpe.

Att Taynã

Byte,

Você é simplesmente o cara, entende tudo desses códigos, eu entendo apenas o básico, queria muito entender como você, você fez algum curso ?
@OFF
Muito obrigado Byte, você solucionou meu problema perfeitamente e me explicou o motivo e tal, perfeito! Dei um OBRIGADO e um +.