Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
» Preciso de uma logo marca para meu canal do YouTube
Hoje à(s) 04:37 am por YouTube Funk

» Emblemas não está sendo modificado
Hoje à(s) 12:14 am por iScroll

» Forum atualiza mais não modifica
Ontem à(s) 11:59 pm por paulim78

» Adicionar Imagem
Ontem à(s) 11:57 pm por paulim78

» Efeito Canvas
Ontem à(s) 11:04 pm por Daniel Yan

» posição like.
Ontem à(s) 10:58 pm por paulim78

» Código JavaScript do Chatbox não surtiu efeito
Ontem à(s) 10:50 pm por Lemon~

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
Ketholy
 
paulim78
 
Gaaratsu
 
while
 
Shek
 
Fou-Lu
 
Eduardo Lima
 
Lemon~
 
odelgado
 
LucasPofahl
 

Quem está conectado
179 usuários online :: 2 usuários cadastrados, Nenhum Invisível e 177 Visitantes :: 3 Motores de busca

AlexG, GustavoDM11

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Problemas com Layout da página HTML.

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

Resolvido Problemas com Layout da página HTML.

Mensagem por Lucas_DarkS em 06/09/16, 11:17 pm

Detalhes da questão


Endereço do fórum: http://www.brasilplaylife.com.br
Versão do fórum: PunBB

Descrição


Olá senhores,
Estou tentando instalar uma página HTML no meu fórum para futuramente utiliza-la como página inicial, porém encontrei um pequeno grande problema no layout do fórum apos importa-lo.

A imagem abaixo ilustra como deveria ficar o layout, com os ícones móveis visiveis:


Já essa imagem abaixo ilustra como está ficando no fórum:


O código da página é o seguinte: 
Código:
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>Brasil Play Life</title>
  <link rel="stylesheet" type="text/css" href="http://brasilplaylife.site88.net/css/style.css">
  <link href="http://brasilplaylife.site88.net/css/font-awesome.min.css" rel="stylesheet">
  <link href="http://brasilplaylife.site88.net/css/animate.css" rel="stylesheet">
</head>
<body onkeypress="return catchControlKeys(event)"> <div class="navigation">
<a href="/" class="logo"><b class="box">BPL</b>Brasil Play Life.<span style="font-size: 14px;border-top: 2px solid #ee3b24;">com.br</span></a>
          <ul class="menu">
            <li class="menu__item">
              <a href=/" class="menu__item-link">Início</a>
            </li>
            <li class="menu__item">
              <a href="www.brasilplaylife.com.br" class="menu__item-link">Fórum</a>
            </li>
            <li class="menu__item">
              <a href="#" class="menu__item-link">O Servidor</a>
            </li>
          <li class="menu__item">
              <a href="#" class="menu__item-link">Adquirir Vip/Sócio</a>
            </li>
            <li class="menu__item">
              <a href="#" class="menu__item-link">Nossa Staff</a>
            </li>
         <li class="menu__item">
              <a href="#" class="menu__item-link">Como Jogar SA-MP</a>
            </li>
         <li class="menu__item">
              <a href="#" class="menu__item-link">Downloads</a>
            </li>
         <li class="menu__item">
              <a href="#" class="menu__item-link">Tutoriais</a>
            </li>
         <li class="menu__item">
              <a href="#" class="menu__item-link">Contato</a>
            </li>                   
</div>
<div class="gta"><div class="pattern">
<p class="animated mov3"><br><span style="color:#e92d33;">BEM VINDO</span><br>AO BRASIL PLAY LIFE RPG!<br><span style="font-size:20px; font-variant: small-caps;">SA:MP Project</span></p>
<a href="samp://ip.brasilplaylife.com.br:9696" class="button button-1 button-1f">Entre Já</a>
</div>
</div>
<div class="content">
<h1>O SERVIDOR:</h1>
<p> Saiba mais sobre o Brasil Play Life - IP: ip.brasilplaylife.com.br:9696</p>
<img src="http://brasilplaylife.site88.net/img/separator.png"alt="">
            <table class="skills animated mov1">
                 <tr class="skills-row">
                    <td class="skill">
                       <h4><i class="fa fa-lightbulb-o fa-3x"></i><p>GAMEMODE</p></h4>
                       <p>Nossa gamemode conta com mais de 30 organizações, sistemas totalmente únicos e faceis de utilizar. Tudo pensando especialmente para você se sentir a vontade e se divertir a beça. </p>
                    </td>
                    <td class="skill animate-me zoomIn">
                       <h4><i class="fa fa-group fa-2x"></i><p>ONLINE</p></h4>
                       <p>Nosso servidor é mantido online 24 Horas com a maior estabilidade possível, tudo para que sua diversão esteja garantida a todo momento.</p>   
                        <script type='text/javascript' src='http://samp-stats.ru/web/api-233.js'></script>
                        <b>Players:</b>  <script type='text/javascript'>document.write(api.players +'/'+ api.maxplayers);</script><br></br>
                     <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">Entrar no Jogo</a></p>
                    </td>
                    <td class="skill animate-me zoomIn">
                       <h4><i class="fa fa-cog fa-3x"></i><p>ATUALIZAÇÕES</p></h4>
                       <p>Nosso servidor está em contanste atualização, nossos programadores estão sempre buscando novas funções e corrigindo bugs no servidor.<br><br><br><br></p>
                    </td>
                 </tr>
              </table>
            
            <br>
<h1>PORQUE JOGAR BRASIL PLAY LIFE ?</h1>
<p>Abaixo algumas das muitas vantagens do nosso servidor</p>
<img src="http://brasilplaylife.site88.net/img/separator.png"alt="">

            <table class="skills animated mov2">
                 <tr class="skills-row">
                    <td class="skill animate-me zoomIn">
                       <h4><i class="fa fa-gamepad fa-3x"></i><p>JOGABILIDADE</p></h4>
                       <p>Nosso servidor RPG conta com diversas organizações policiais, criminosas, governamentais. Além de diversos empregos secundários e muitos eventos.</p><br>
                     <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">ip.brasil play life.com.br:9696</a></p>
                    </td>
                    <td class="skill animate-me zoomIn">
                       <h4><i class="fa fa-globe fa-3x"></i><p></p></h4>
                       <p>Divulgue nosso IP para os seus amigos e complete ainda mais a sua diversão, porque melhor do que jogar BPL é jogar BPL com seus amigos.Abaixo está o nosso IP:</p><br>
                     <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">ip.brasil play life.com.br:9696</a></p>
                    </td>
                    <td class="skill animate-me zoomIn">
                       <h4><i class="fa fa-cogs fa-3x"></i><p>MANUTENÇÃO</p></h4>
                       <p>Nós nos preocupamos muito com a manutenção do servidor, desde bons profissionais na administração até a boa conexão dos players ao servidor, sempre mantendo atualizado e online</p><br>
                     <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">ip.brasil play life.com.br:9696</a></p>
                    </td>
                 </tr>
              </table>
</div>
<div class="footer">
              <table class="foot-foot-skills">
                    <td class="foot-skill animate-me zoomIn">
<a href="/" class="footer-logo"></a>
<p class="info">Brasil Play Life é um servidor de SA-MP (San Andreas Multiplayer) que utiliza o modo de jogo RPG, ou seja, simulação de vida real. Para jogar basta baixar o GTA San Andreas + San Andreas Multiplayer(SA-MP), adicionar nosso ip na lista dos favoritos e logar<br></br>Nosso IP: ip.brasilplaylife.com.br:9696</p>
                    </td>
                    <td class="foot-skill animate-me zoomIn">
                       <h4>Links
                     <p><img src="http://brasilplaylife.site88.net/img/foot-sep.png"alt=""></p></h4>
   <div class="foot-nav">
    <li><a href="#2" target="_blank">> Tutoriais</a></li>
    <li><a href="#3">> Fórum do Servidor</a></li>
   <li><a href="#4">> Comprar VIP/SÓCIO</a></li>
    <li><a href="#5">> Como Jogar Brasil Play Life?</a></li>
   </div>
                    </td>
                    <td class="foot-skill animate-me zoomIn">
                       <h4>Contato
                     <p><img src="http://brasilplaylife.site88.net/img/foot-sep.png"alt=""></p></h4>
   <div class="asd">
         <p>Para nos contactar mande um e-mail para<br>brasilplaylife<span style="color:#f2333a">@</span>outlook.com</p>

<script type="text/javascript">(function() {
  if (window.pluso)if (typeof window.pluso.start == "function") return;
  if (window.ifpluso==undefined) { window.ifpluso = 1;
    var d = document, s = d.createElement('script'), g = 'getElementsByTagName';
    s.type = 'text/javascript'; s.charset='UTF-8'; s.async = true;
    s.src = ('https:' == window.location.protocol ? 'https' : 'http')  + '://share.pluso.ru/pluso-like.js';
    var h=d[g]('body')[0];
    h.appendChild(s);
  }})();</script><div class="pluso" data-background="transparent" data-options="small,square,line,horizontal,nocounter,theme=02" data-services="vkontakte,facebook,twitter,moimir"></div>
   </div>
                    </td>
              
              </table>
              <div class="copyright">
2016 Brasil Play Life - SA-MP - RPG. Site By:<a href="#">RDMP.RU</a> Todos os direitos reservados!
<span style="float:right;">Tecnologia By: <a href="/" target="_blank" style="border-bottom: 1px dotted #f2333a;">APOX</a></span>
</div>            
            
</div>

<script>
$(window).scroll(function() {
    $('.mov1').each(function(){
      var imagePos = $(this).offset().top;
      var topOfWindow = $(window).scrollTop();
      if (imagePos < topOfWindow+300) {
        $(this).addClass('zoomIn');
      }
    });
  });
$(window).scroll(function() {
    $('.mov2').each(function(){
      var imagePos = $(this).offset().top;
      var topOfWindow = $(window).scrollTop();
      if (imagePos < topOfWindow+300) {
        $(this).addClass('flipInX');
      }
    });
  });
$(window).scroll(function() {
    $('.mov3').each(function(){
      var imagePos = $(this).offset().top;
      var topOfWindow = $(window).scrollTop();
      if (imagePos < topOfWindow+0) {
        $(this).addClass('fadeInLeftBig');
      }
    });
  });
</script>

</body>
</html>

Lembrando que existem css externas que eu hospedei em um host externo. O site hospedado no servidor externo apresenta o layout de forma correta. O problema só surge quando passo o layout para o fórum.

Site na hospedagem externa: http://brasilplaylife.site88.net
Site no forumeiros: http://www.brasilplaylife.com.br/h1-projetoinicial

Aguardando suporte. 
Grato, desde já!
avatar

Lucas_DarkS
Nível 2

Masculino
Inscrito dia : 10/08/2016
Mensagens : 8
Pontos Ativos : 14

Ver perfil do usuário http://brasilplaylife.livreforum.com

Resolvido Re: Problemas com Layout da página HTML.

Mensagem por while em 06/09/16, 11:43 pm

Olá autor, você tem instalado o font-awesome no seu fórum?
Caso não, peço que instale vendo esse tópico: http://ajuda.forumeiros.com/t103208-

Caso, mesmo assim não der, troque o código do seu formulário por este:

Código:
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>Brasil Play Life</title>
  <link rel="stylesheet" type="text/css" href="http://brasilplaylife.com.br/css/style.css">
  <link href="http://brasilplaylife.com.br/css/font-awesome.min.css" rel="stylesheet">
  <link href="http://brasilplaylife.com.br/css/animate.css" rel="stylesheet">
</head>
<body onkeypress="return catchControlKeys(event)"> <div class="navigation">
<a href="/" class="logo"><b class="box">BPL</b>Brasil Play Life.<span style="font-size: 14px;border-top: 2px solid #ee3b24;">com.br</span></a>
          <ul class="menu">
            <li class="menu__item">
              <a href=/" class="menu__item-link">Início</a>
            </li>
            <li class="menu__item">
              <a href="www.brasilplaylife.com.br" class="menu__item-link">Fórum</a>
            </li>
            <li class="menu__item">
              <a href="#" class="menu__item-link">O Servidor</a>
            </li>
          <li class="menu__item">
              <a href="#" class="menu__item-link">Adquirir Vip/Sócio</a>
            </li>
            <li class="menu__item">
              <a href="#" class="menu__item-link">Nossa Staff</a>
            </li>
        <li class="menu__item">
              <a href="#" class="menu__item-link">Como Jogar SA-MP</a>
            </li>
        <li class="menu__item">
              <a href="#" class="menu__item-link">Downloads</a>
            </li>
        <li class="menu__item">
              <a href="#" class="menu__item-link">Tutoriais</a>
            </li>
        <li class="menu__item">
              <a href="#" class="menu__item-link">Contato</a>
            </li>                   
</div>
<div class="gta"><div class="pattern">
<p class="animated mov3"><br><span style="color:#e92d33;">BEM VINDO</span><br>AO BRASIL PLAY LIFE RPG!<br><span style="font-size:20px; font-variant: small-caps;">SA:MP Project</span></p>
<a href="samp://ip.brasilplaylife.com.br:9696" class="button button-1 button-1f">Entre Já</a>
</div>
</div>
<div class="content">
<h1>O SERVIDOR:</h1>
<p> Saiba mais sobre o Brasil Play Life - IP: ip.brasilplaylife.com.br:9696</p>
<img src="http://brasilplaylife.site88.net/img/separator.png"alt="">
            <table class="skills animated mov1">
                <tr class="skills-row">
                    <td class="skill">
                      <h4><i class="fa fa-lightbulb-o fa-3x"></i><p>GAMEMODE</p></h4>
                      <p>Nossa gamemode conta com mais de 30 organizações, sistemas totalmente únicos e faceis de utilizar. Tudo pensando especialmente para você se sentir a vontade e se divertir a beça. </p>
                    </td>
                    <td class="skill animate-me zoomIn">
                      <h4><i class="fa fa-group fa-2x"></i><p>ONLINE</p></h4>
                      <p>Nosso servidor é mantido online 24 Horas com a maior estabilidade possível, tudo para que sua diversão esteja garantida a todo momento.</p> 
                        <script type='text/javascript' src='http://samp-stats.ru/web/api-233.js'></script>
                        <b>Players:</b>  <script type='text/javascript'>document.write(api.players +'/'+ api.maxplayers);</script><br></br>
                    <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">Entrar no Jogo</a></p>
                    </td>
                    <td class="skill animate-me zoomIn">
                      <h4><i class="fa fa-cog fa-3x"></i><p>ATUALIZAÇÕES</p></h4>
                      <p>Nosso servidor está em contanste atualização, nossos programadores estão sempre buscando novas funções e corrigindo bugs no servidor.<br><br><br><br></p>
                    </td>
                </tr>
              </table>
           
            <br>
<h1>PORQUE JOGAR BRASIL PLAY LIFE ?</h1>
<p>Abaixo algumas das muitas vantagens do nosso servidor</p>
<img src="http://brasilplaylife.site88.net/img/separator.png"alt="">

            <table class="skills animated mov2">
                <tr class="skills-row">
                    <td class="skill animate-me zoomIn">
                      <h4><i class="fa fa-gamepad fa-3x"></i><p>JOGABILIDADE</p></h4>
                      <p>Nosso servidor RPG conta com diversas organizações policiais, criminosas, governamentais. Além de diversos empregos secundários e muitos eventos.</p><br>
                    <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">ip.brasil play life.com.br:9696</a></p>
                    </td>
                    <td class="skill animate-me zoomIn">
                      <h4><i class="fa fa-globe fa-3x"></i><p></p></h4>
                      <p>Divulgue nosso IP para os seus amigos e complete ainda mais a sua diversão, porque melhor do que jogar BPL é jogar BPL com seus amigos.Abaixo está o nosso IP:</p><br>
                    <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">ip.brasil play life.com.br:9696</a></p>
                    </td>
                    <td class="skill animate-me zoomIn">
                      <h4><i class="fa fa-cogs fa-3x"></i><p>MANUTENÇÃO</p></h4>
                      <p>Nós nos preocupamos muito com a manutenção do servidor, desde bons profissionais na administração até a boa conexão dos players ao servidor, sempre mantendo atualizado e online</p><br>
                    <p><a href="samp://ip.brasilplaylife.com.br:9696" class="btn">ip.brasil play life.com.br:9696</a></p>
                    </td>
                </tr>
              </table>
</div>
<div class="footer">
              <table class="foot-foot-skills">
                    <td class="foot-skill animate-me zoomIn">
<a href="/" class="footer-logo"></a>
<p class="info">Brasil Play Life é um servidor de SA-MP (San Andreas Multiplayer) que utiliza o modo de jogo RPG, ou seja, simulação de vida real. Para jogar basta baixar o GTA San Andreas + San Andreas Multiplayer(SA-MP), adicionar nosso ip na lista dos favoritos e logar<br></br>Nosso IP: ip.brasilplaylife.com.br:9696</p>
                    </td>
                    <td class="foot-skill animate-me zoomIn">
                      <h4>Links
                    <p><img src="http://brasilplaylife.site88.net/img/foot-sep.png"alt=""></p></h4>
  <div class="foot-nav">
    <li><a href="#2" target="_blank">> Tutoriais</a></li>
    <li><a href="#3">> Fórum do Servidor</a></li>
  <li><a href="#4">> Comprar VIP/SÓCIO</a></li>
    <li><a href="#5">> Como Jogar Brasil Play Life?</a></li>
  </div>
                    </td>
                    <td class="foot-skill animate-me zoomIn">
                      <h4>Contato
                    <p><img src="http://brasilplaylife.site88.net/img/foot-sep.png"alt=""></p></h4>
  <div class="asd">
        <p>Para nos contactar mande um e-mail para<br>brasilplaylife<span style="color:#f2333a">@</span>outlook.com</p>

<script type="text/javascript">(function() {
  if (window.pluso)if (typeof window.pluso.start == "function") return;
  if (window.ifpluso==undefined) { window.ifpluso = 1;
    var d = document, s = d.createElement('script'), g = 'getElementsByTagName';
    s.type = 'text/javascript'; s.charset='UTF-8'; s.async = true;
    s.src = ('https:' == window.location.protocol ? 'https' : 'http')  + '://share.pluso.ru/pluso-like.js';
    var h=d[g]('body')[0];
    h.appendChild(s);
  }})();</script><div class="pluso" data-background="transparent" data-options="small,square,line,horizontal,nocounter,theme=02" data-services="vkontakte,facebook,twitter,moimir"></div>
  </div>
                    </td>
             
              </table>
              <div class="copyright">
2016 Brasil Play Life - SA-MP - RPG. Site By:<a href="#">RDMP.RU</a> Todos os direitos reservados!
<span style="float:right;">Tecnologia By: <a href="/" target="_blank" style="border-bottom: 1px dotted #f2333a;">APOX</a></span>
</div>           
           
</div>

<script>
$(window).scroll(function() {
    $('.mov1').each(function(){
      var imagePos = $(this).offset().top;
      var topOfWindow = $(window).scrollTop();
      if (imagePos < topOfWindow+300) {
        $(this).addClass('zoomIn');
      }
    });
  });
$(window).scroll(function() {
    $('.mov2').each(function(){
      var imagePos = $(this).offset().top;
      var topOfWindow = $(window).scrollTop();
      if (imagePos < topOfWindow+300) {
        $(this).addClass('flipInX');
      }
    });
  });
$(window).scroll(function() {
    $('.mov3').each(function(){
      var imagePos = $(this).offset().top;
      var topOfWindow = $(window).scrollTop();
      if (imagePos < topOfWindow+0) {
        $(this).addClass('fadeInLeftBig');
      }
    });
  });
</script>

</body>
</html>

Resulta?
Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3137
Pontos Ativos : 4574

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Problemas com Layout da página HTML.

Mensagem por Lucas_DarkS em 07/09/16, 12:10 am

Muito Obrigado. Instalei a font-awesome e tudo resolvido. Pode fechar o tópico!!! Muito feliz
avatar

Lucas_DarkS
Nível 2

Masculino
Inscrito dia : 10/08/2016
Mensagens : 8
Pontos Ativos : 14

Ver perfil do usuário http://brasilplaylife.livreforum.com

Resolvido Re: Problemas com Layout da página HTML.

Mensagem por Fraise em 07/09/16, 12:17 am

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5023
Pontos Ativos : 6703

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum