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.
Acesso rápido

Fóruns de suporte oficiais


Meriteiro

Outubro de 2016



"Este membro destacou-se pela sua dedicação e pelo seu esforço.
Ao longo do último mês, demonstrou as suas capacidades gerais no FDF e, por isso, merece o nosso agradecimento."
Login

Esqueci minha senha

Últimos assuntos
» [Logo] Pássaros
Hoje à(s) 11:45 por P.H

» Criar tgs bbcodes
Hoje à(s) 10:53 por sandra51

» Mudar pre-visualização do formulário
Hoje à(s) 4:03 por YouTube3

» Problema com de css com a class .page-body
Hoje à(s) 0:49 por Lemon~

» Widgets no final do fórum
Hoje à(s) 0:43 por Kyo Panda

» Problema para arrumar a logo.
Hoje à(s) 0:28 por Kyo Panda

» Conflito com CKEditor
Hoje à(s) 0:20 por Kyo Panda

Perdi minha senha!
Obter senha

Nota: use se tiver perdido acesso ao seu painel de controle.

Últimas sugestões
Parceiros Forumeiros
Quem está conectado
112 usuários online :: 1 usuário cadastrado, Nenhum Invisível e 111 Visitantes :: 1 Motor de busca

P.H

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

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 Qua 7 Set 2016 - 3:17

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á!

Lucas_DarkS
Nível 2

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

http://brasilplaylife.livreforum.com

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

Mensagem por while em Qua 7 Set 2016 - 3:43

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.

while
Usuário experiente

Masculino
Inscrito dia : 24/04/2016
Mensagens : 2817
Pontos Ativos : 4143

http://www.ajuda.forumeiros.com https://www.facebook.com/https://www.facebook.com/profile.php?id=100012157981279

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

Mensagem por Lucas_DarkS em Qua 7 Set 2016 - 4:10

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

Lucas_DarkS
Nível 2

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

http://brasilplaylife.livreforum.com

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

Mensagem por Fraise em Qua 7 Set 2016 - 4:17

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

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

Fraise
Super usuário

Masculino
Inscrito dia : 26/06/2015
Mensagens : 4973
Pontos Ativos : 7157

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
Fórum dos Fóruns - Ajuda mútua para usuários forumeiros
on
Fórum grátis: interajuda aos usuários forumeiros. Criar e administrar um fórum. Descubra nossos guias, tutoriais e astúcias no suporte de Forumeiros.
Votações: 5