Centralizar elemento de página HTML

2 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Centralizar elemento de página HTML

Mensagem por Daniel_F98 10.10.15 14:44

Detalhes da questão


Endereço do fórum: http://bplayfacilrpg.forumeiros.com
Versão do fórum: PhpBB3

Descrição


Olá queria saber se tem como centrar o menu que está no rectângulo vermelho.
Centralizar elemento de página HTML Wvqpzd

Codigo da Pagina:
Código:
<br />
<center>
   <iframe src="http://www.radiosoundhits.com.br/players/grande/preto" frameborder="0" scrolling="no" style="width: 70%; height: 45px;">
   </iframe>
</center>
<center>
           <br />
</center>
<center>
           <br />
</center>
 <script language="JavaScript">
    function down() { if (event.button==2) { alert("Cuidado,pois o responsável da pagina foi avisado!."); } } function up() { if (event.button==2) { alert("Por favor, não repita isso! Essa página está protegida contra escrita!"); document.write("<body bgcolor='000000' text='ff0000'><center><h1>Se você ainda não sabe fazer uma cópia sem autorização do autor é crime.</h1></center><br><br>"); document.write('<a href="javascript:history.back()"><center>Voltar</center></a>'); } } document.onmousedown=down; document.onmouseup=up;
    function MM_displayStatusMsg(msgStr) { http://v1.0
    status=msgStr;
    document.MM_returnValue = true;}
    </script><script language="JavaScript">
        <!--
        var mensagem="";
        function clickIE() {if (document.all) {(mensagem);return false;}}
        function clickNS(e) {if
        (document.layers||(document.getElementById&&!document.all)) {
        if (e.which==2||e.which==3) {alert (" FORUM PROTEGIDO - EQUIPE BPS ")(mensagem);return false;}}}
        if (document.layers)
        {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
        else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
        document.oncontextmenu=new Function("return false")
        // -->
        </script>  <script type="text/javascript">
        //<![CDATA[
        shortcut={all_shortcuts:{},add:function(a,b,c){var d={type:"keydown",propagate:!1,disable_in_input:!1,target:document,keycode:!1};if(c)for(var e in d)"undefined"==typeof c[e]&&(c[e]=d[e]);else c=d;d=c.target,"string"==typeof c.target&&(d=document.getElementById(c.target)),a=a.toLowerCase(),e=function(d){d=d||window.event;if(c.disable_in_input){var e;d.target?e=d.target:d.srcElement&&(e=d.srcElement),3==e.nodeType&&(e=e.parentNode);if("INPUT"==e.tagName||"TEXTAREA"==e.tagName)return}d.keyCode?code=d.keyCode:d.which&&(code=d.which),e=String.fromCharCode(code).toLowerCase(),188==code&&(e=","),190==code&&(e=".");var f=a.split("+"),g=0,h={"`":"~",1:"!",2:"@",3:"#",4:"$",5:"%",6:"^",7:"&",8:"*",9:"(",0:")","-":"_","=":"+",";":":","'":'"',",":"<",".":">","/":"?","\":"|"},i={esc:27,escape:27,tab:9,space:32,"return":13,enter:13,backspace:8,scrolllock:145,scroll_lock:145,scroll:145,capslock:20,caps_lock:20,caps:20,numlock:144,num_lock:144,num:144,pause:19,"break":19,insert:45,home:36,"delete":46,end:35,pageup:33,page_up:33,pu:33,pagedown:34,page_down:34,pd:34,left:37,up:38,right:39,down:40,f1:112,f2:113,f3:114,f4:115,f5:116,f6:117,f7:118,f8:119,f9:120,f10:121,f11:122,f12:123},j=!1,l=!1,m=!1,n=!1,o=!1,p=!1,q=!1,r=!1;d.ctrlKey&&(n=!0),d.shiftKey&&(l=!0),d.altKey&&(p=!0),d.metaKey&&(r=!0);for(var s=0;k=f[s],s<f.length;s++)"ctrl"==k||"control"==k?(g++,m=!0):"shift"==k?(g++,j=!0):"alt"==k?(g++,o=!0):"meta"==k?(g++,q=!0):1<k.length?i[k]==code&&g++:c.keycode?c.keycode==code&&g++:e==k?g++:h[e]&&d.shiftKey&&(e=h[e],e==k&&g++);if(g==f.length&&n==m&&l==j&&p==o&&r==q&&(b(d),!c.propagate))return d.cancelBubble=!0,d.returnValue=!1,d.stopPropagation&&(d.stopPropagation(),d.preventDefault()),!1},this.all_shortcuts[a]={callback:e,target:d,event:c.type},d.addEventListener?d.addEventListener(c.type,e,!1):d.attachEvent?d.attachEvent("on"+c.type,e):d["on"+c.type]=e},remove:function(a){var a=a.toLowerCase(),b=this.all_shortcuts[a];delete this.all_shortcuts[a];if(b){var a=b.event,c=b.target,b=b.callback;c.detachEvent?c.detachEvent("on"+a,b):c.removeEventListener?c.removeEventListener(a,b,!1):c["on"+a]=!1}}},shortcut.add("Ctrl+U",function(){top.location.href="/h6-"});
        //]]>
        </script><title>Brasil Play Facil RPG</title><meta iso-8859-1"="" content="text/html;charset=" http-equiv="Content-Type" /><style>
    <link rel="stylesheet" type="text/css"  href="estilo.css" />
    body,h1,h2,h3,p,quote,small,form,input,ul,li,ol,label{
      /* The reset rules */
      margin:0px;
      padding:0px;
    }

    body{
      color:#FFFF;
      font-size:13px;
   
      font-family:Arial, Helvetica, sans-serif;
      width: 100%;
      background:url("http://ocdn.eu/images/pulscms/ZTI7MDA_/3fc0026b0e67aa85d145bd05989b9b84.jpg") no-repeat; center;
            background-size: cover;
    }
    /*--- MENU DROPDOWN ---*/
    #cssmenu {
      text-align: center;
        margin-top: 100px;
        background: rgba(0, 0, 0, 0.28);
        border: 1px solid rgba(0, 0, 0, 0.4);
        padding: 15px;
        padding:10px;
        color:#CCC;
        display: block;
        margin: 50px auto;
        width: 1000px;
        float: center;
      font: 67.5% 'Lucida Sans Unicode', 'Bitstream Vera Sans', 'Trebuchet Unicode MS', 'Lucida Grande', Verdana, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: bold;
    }
    #cssmenu ul {
      background: #333333;
      height: 35px;
      list-style: none;
      margin: 0;
      padding: 0;
      text-shadow: 2px 2px 2px #000;
    }
    #cssmenu li {
      float: left;
      padding: 0px;
    }
    #cssmenu li a {
      background: #333333 url('seperator.gif') bottom right no-repeat;
      display: block;
      font-weight: normal;
      line-height: 35px;
      margin: 0px;
      padding: 0px 25px;
      text-align: center;
      text-decoration: none;
    }
    #cssmenu > ul > li > a {
      color: #cccccc;
    }
    #cssmenu ul ul a {
      color: #cccccc;
    }
    #cssmenu li > a:hover,
    #cssmenu ul li:hover > a {
      background: #575959 url('hover.png') bottom center no-repeat;
      color: #ffffff;
      text-decoration: none;
      text-shadow: 0 0 0.2em #87F, 0 0 0.2em #87F, 0 0 0.2em #87F;
    }
    #cssmenu li ul {
      background: #333333;
      display: none;
      height: auto;
      padding: 0px;
      margin: 0px;
      border: 0px;
      position: absolute;
      width: 225px;
      z-index: 200;
      /*top:1em;
      /*left:0;*/

    }
    #cssmenu li:hover ul {
      display: block;
    }
    #cssmenu li li {
      background: url('sub_sep.gif') bottom left no-repeat;
      display: block;
      float: none;
      margin: 0px;
      padding: 0px;
      width: 225px;
    }
    #cssmenu li:hover li a {
      background: none;
    }
    #cssmenu li ul a {
      display: block;
      height: 35px;
      font-size: 12px;
      font-style: normal;
      margin: 0px;
      padding: 0px 10px 0px 15px;
      text-align: left;
    }
    #cssmenu li ul a:hover,
    #cssmenu li ul li:hover > a {
      background: #575959 url('hover_sub.png') center left no-repeat;
      border: 0px;
      color: #ffffff;
      text-decoration: none;
    }
    #cssmenu p {
      clear: left;
    }



    h1{
      font-size:28px;
      font-weight:bold;
      font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;
      letter-spacing:1px;
      text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
      color:#FFF;
    }
    h3{
      font-size:13px;
      font-weight:bold;
      font-family:"Courier New";
      letter-spacing:1px;
      color:#FFF;
      text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    }

    h2{
      font-family:"Arial Narrow",Arial,Helvetica,sans-serif;
      font-size:10px;
      font-weight:normal;
      letter-spacing:1px;
      padding-left:2px;
      text-transform:uppercase;
      white-space:nowrap;
      margin-top:4px;
      color:#FFF;
      text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    }

    #main p{
      padding-bottom:8px;
    }

    .clear{
      clear:both;
    }

    #main{
      width:800px;
      /* Centering it in the middle of the page */
      margin:60px auto;
    margin-top:1px;
    }

    #main2{
      width:100px;
    margin:100px auto;
    }

    .container{
    margin-top: 20px;
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(0, 0, 0, 0.4);
    padding: 15px;

    }
    .container2{
      margin-top:20px;
      margin:100px;
      background:#FFFFFF;
      border:1px solid #E0E0E0;


    }

    .err{
      color:red;
    }

    .success{
      color:#00CC00;
    }

    a, a:visited {
   
      text-decoration:none;
      outline:none;
    }

    a:hover{
      text-decoration: none;
    }

    .footer{
      text-align:center;
      padding:10px;
      color:#CCC;
      text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    }
    #leftrightcontainer{
        width:700px;
        height:400px;
        border:none;
      margin: 0 auto;
    }

    #leftrightcontainer div{
        width:40%;
        float:left;
        height:350px;
      margin-top:20px;
        margin-right:35px;
      background:#FFFFFF;
      border:1px solid #E0E0E0;
      padding:15px;
   
    }






    .alert {
      background: #fff6bf url(../images/exclamation.png) center no-repeat;
      background-position: 15px 50%; /* x-pos y-pos */
      text-align: left;
      padding: 5px 20px 5px 45px;
      border-top: 2px solid #ffd324;
      border-bottom: 2px solid #ffd324;
      }
    .done {
      background: #d7f7c4 url(../images/accept.png) center no-repeat;
      background-position: 15px 50%; /* x-pos y-pos */
      text-align: left;
      padding: 5px 20px 5px 45px;
      border-top: 2px solid #82cb2f;
      border-bottom: 2px solid #82cb2f;
      }
    a#button, a#button:visited {
    display:inline-block;
    background: url(http://i49.servimg.com/u/f49/15/99/54/36/simple10.png) repeat-x;
    width: 150px;
    padding:10px 0;
    text-align:center;
    border:1px solid #608925;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.<img src="http://2img.net/i/fa/i/smiles/icon_cool.gif" alt="Cool" longdesc="6" />;
    font-weight:bold;
    text-transform:uppercase;
    color:#FFF;
    text-decoration: none;
    opacity:.85;
    }

    a#button:hover {
    border-color:#49671d;
    }

    a#button:active {
    background-position:  0 -200px;
    padding:11px 0 9px;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.<img src="http://2img.net/i/fa/i/smiles/icon_cool.gif" alt="Cool" longdesc="6" />;
    }
    </style>    <script type="text/javascript">
    //Created by Title bar Maker (http://www.bosiljak.hr/titlemaker)
    function tb8_makeArray(n){
      this.length = n;
      return this.length;
    }


    tb8_messages = new tb8_makeArray(3);
    tb8_messages[0] = "Brasil Good Life rpg;
    tb8_messages[1] = "Seja Bem Vindo ao nosso servidor !";
    tb8_messages[2] = "Esperemos que se divirta no nosso servidor.";
    tb8_rptType = 'infinite';
    tb8_rptNbr = 5;
    tb8_speed = 100;
    tb8_delay = 2000;
    var tb8_counter=1;
    var tb8_currMsg=0;
    var tb8_tekst ="";
    var tb8_i=0;
    var tb8_TID = null;
    function tb8_pisi(){
      tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);
      document.title = tb8_tekst;
      tb8_sp=tb8_speed;
      tb8_i++;
      if (tb8_i==tb8_messages[tb8_currMsg].length){
          tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;
      }
      if (tb8_currMsg == tb8_messages.length){
          if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){
            clearTimeout(tb8_TID);
            return;
          }
          tb8_counter++;
          tb8_currMsg = 0;
      }
      tb8_TID = setTimeout("tb8_pisi()", tb8_sp);
    }
    tb8_pisi()
    </script>
<div align="center" class="pageContent">
                                                                                                                                                                      
   <div id="cssmenu">
                                                                                                                                                                                     
      <ul>
                                                                                                                                                                                                                
         <li>
                                                                                                                        <a href="http://bplayfacilrpg.forumeiros.com/forum"><span><strong>          Forum BPF        </strong></span></a>                                                                                               
         </li>
                                                                                                                                                                                                                  
         <li>
                                                                            <a href="http://bplayfacilrpg.forumeiros.com/portal"><span><strong>      Portal do Forum        </strong></span></a>                                                                                               
         </li>
                                                                      
         <li>
                                                                                <a href="http://bplayfacilrpg.forumeiros.com/f71-noticias-da-administracao"><span><strong>          Info Vip/Socio        </strong></span></a>                                                                                                                                                                                       
         </li>
                      
         <li>
                                                                                        <a href="http://bplayfacilrpg.forumeiros.com/login"><span><strong>    LOGIN        </strong></span></a>                                                                                                   
         </li>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
         <li class="last">
                                                                                                                            <a href="http://sa-mp.com/download.php"><span><strong>  SA:MP 0.3.7</strong></span></a>       
         </li>
                      
      </ul>
                       
   </div>
                
   <div id="main">
                   
      <div class="container">
                      
         <h1 align="center">
                                                                                                                          <span style="font-size: 38px;"><span style="color: rgb(0, 153, 0);">Brasil Play Facil</span></span>
         </h1>
                                                                                                                                                                                                              
         <h2 align="center">
                                                                                              <strong><span style="font-size: 16px;">    <strong>Venha Viver o melhor do RPG!.</strong></span></strong>     
         </h2>
                  
      </div>
               
      <div align="center" class="container">
                  
         <h1 align="center">
                  Seja Bem Vindo ao nosso Forum       
         </h1>
                      
         <div align="center" class="container">
                         
            <h1 align="center">
                       <strong style="color: rgb(17, 17, 17); font-family: Arial, Helvetica, sans-serif; font-size: 13px;"><span style="font-size: 16px;"><span style="color: rgb(255, 255, 255);"><span style="color: #990cc;">Aqui voce encontra  o que precisa de saber sobre o servidor, atualizacoes e muitas outras coisas. Todas as novidades serao postadas aqui!</span></span></span></strong><br />                                                                             
            </h1>
                                                                                                                                                                 
         </div>
                                                                                                                                                                                  
         <div align="center" class="container">
                                                                                                                                               
            <h2 align="center">
                                                                                                       <strong <span="" servidor:="" do="" ip=""><span style="font-size: 24px;"><span style="font-size: 24px;"><span style="color: rgb(255, 0, 0);">IP do servidor:</span><span style="color: rgb(255, 52, 92);"> </span></span></span></strong><span style="color: rgb(255, 0, 153);"><span style="font-size: 24px;"><strong>158.69.128.124:7777</strong></span></span>
            </h2>
                                                                                                                                                                                                                                                                           
         </div>
                                                                                                                                                                                                                
         <div class="container footer">
                                                                                                                                                                                                                                         
            <h2 align="center">
                                                                                                     <strong><span style="font-size: 24px;"><span style="color: rgb(255, 0, 0);">IP DO TEAM SPEAK3</span>:  </span><span style="color: rgb(255, 153, 51); font-size: 18px;">ts.brasilplayfacil.com.br</span></strong>
            </h2>
                                                                                                                                                                                                                             
         </div><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" bgcolor="#000000" name="chat" flashvars="id=215653876&gn=BGLBrasilGoodLife2015" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" style="width: 100%; height: 450px;" /><br /><span style="font-size: smaller;"><a target="_BLANK" href="http://xat.com/web_gear/chat/embed.php?id=215653876&GroupName=BGLBrasilGoodLife2015">Get BGLBrasilGoodLife2015 chat group</a> | <a target="_BLANK" href="http://xat.com/BGLBrasilGoodLife2015"> Goto BGLBrasilGoodLife2015 website</a></span><br />                                              <a target="_blank" href="http://www.forumeiros.com"></a>                                                                                                                                               
         <div class="container footer">
                                                                                                <span style="color: rgb(27, 147, 255);">                          © Copyright 2015 -Desenvolvido por: viciado_scarface -Todos os Direitos Reservados</span><a href="http://www.forumeiros.com" target="_blank"></a><object style="width: 1px; height: 1px;"><param id="movie" value="http://static.mp3.zdn.vn/skins/mp3_main/flash/player/mp3Player_skin1.swf?xmlurl=http://static.mp3.zdn.vn/skins/mp3_main/flash/player/mp3Player_skin1.swf?xmlurl=http://mp3.zing.vn/blog?MjAxMS8wNC8xNy8yLzIvInagaMEMjJlMmVhYWVhNGQ3MDQzNzE3MDk0Y2UzNTFjZTgyNTUdUngWeBXAzfEIdUngWS5PLkIdUngfFN5mUsIC3RlWeBSBvInagaMEZiBhIERvInagaMEd258MXwy" /><param id="quality" value="high" /><param id="wmode" value="transparent" /><embed style="width: 1px; height: 1px;" src="http://static.mp3.zdn.vn/skins/mp3_main/flash/player/mp3Player_skin1.swf?xmlurl=http://static.mp3.zdn.vn/skins/mp3_main/flash/player/mp3Player_skin1.swf?xmlurl=http://mp3.zing.vn/blog?MjAxMS8wNC8xNy8yLzIvInagaMEMjJlMmVhYWVhNGQ3MDQzNzE3MDk0Y2UzNTFjZTgyNTUdUngWeBXAzfEIdUngWS5PLkIdUngfFN5mUsIC3RlWeBSBvInagaMEZiBhIERvInagaMEd258MXwy" quality="high" wmode="transparent" type="application/x-shockwave-flash" /></object><br /> <embed style="width: 1px; height: 1px;" src="https://www.youtube.com/watch?v=TcT4Y_sQ0qg?version=3&hl=pt_BR&rel=0&autoplay=1;volume=70;" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" />                                                                                             
         </div>
                        
      </div>
                     
   </div>
</div>


Aguardo Resposta @Fraise
Daniel_F98

Daniel_F98
Novo Membro

Membro desde : 10/10/2015
Mensagens : 3
Pontos : 7

http://bplayfacilrpg.forumeiros.com/forum

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Centralizar elemento de página HTML

Mensagem por Fraise 10.10.15 14:59

Olá!

Adicione no inicio do código da sua página HTML:
Código:
<style>
#cssmenu {
width: 670px !important;
}
</style>

Até mais.
Fraise
Fraise

Fraise
Ajudeiro
Ajudeiro

Membro desde : 26/06/2015
Mensagens : 6561
Pontos : 8045

https://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Ir para o topo Ir para baixo

Ajudeiro

Tópico resolvido Re: Centralizar elemento de página HTML

Mensagem por Fraise 13.10.15 18:45

Questão abandonada pelo autor, mas considerada resolvida por ter solução para o problema.
Tópico marcado como Resolvido e movido para Questões resolvidas.
Fraise

Fraise
Ajudeiro
Ajudeiro

Membro desde : 26/06/2015
Mensagens : 6561
Pontos : 8045

https://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo


Permissões neste sub-fórum
Não podes responder a tópicos