Problema com criação de nova página HTML

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

Atendido / Resolvido Problema com criação de nova página HTML

Mensagem por juleic1123 em 02.03.20 10:11

Detalhes da questão


Endereço do fórum: http://online-winxclub.com
Versão do fórum: phpBB3

Descrição


Muito bom dia a todos Muito feliz
Estava tentando concluir as últimas páginas para colocar em meu blog e actualizar no fórum, e acabei por ficar encalhado numa parte. Estava usando de base os códigos criados pelo @Pedxz no meu ultimo tópico de ajuda, que me ajudou imenso e já fiz mais de 20 páginas usando seu código como base Feliz

Estava agora terminando uma das últimas e acabei encalhado, uma vez que o botão que diz "Back" não está com a cor correta apesar de ter colocado e não estou conseguindo colocar o texto "SEASON 1" "SEASON 2" "SEASON 3" "SEASON 4" na barra cor de rosa e com hiperligação para /?pid=1

Link e código: https://online--winxclub.forumotion.com/h69-summary-en-html

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }

        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
        #player_magic .player_status a {
        color: #ff0080;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
        width: 10%;
        margin-left: 169%;
        margin-top: -25px;
        color: #1a222a;
        font-weight: 300;
        font-family: sans-serif;
        font-size: 12px;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>           
<div id="player_magic">
                         <strong class="player_title">Story</strong> 
                     
   <div class="player_status">
                                             
      <p>
                                     <a href="/pid=1">Summary</a>                         
      </p>
                                             
      
   <div class="player_desc">
      <p>
                                     <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>                         
      </p>
                                                   
   </div>
<div align="center">
          <br /><iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 200%; height: 900px;"></iframe>                                                                                                                                                                       
      </div>
                                    
</div>

A ideia é o resultado final ficar assim:
Problema com criação de nova página HTML Synopsis%2Bexample

Muito obrigado pela ajuda desde já Muito feliz
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 03.03.20 22:19

up
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 05.03.20 14:40

up
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por ZombieW em 05.03.20 21:56

As session seriam links ou apenas abas?
ZombieW

ZombieW
Membro do Fórum

Masculino
Inscrito dia : 02/08/2010
Mensagens : 1453
Pontos Ativos : 2023

http://www.perfectteam.org

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 06.03.20 12:31

O texto que diz "season 1" "season 2", e etc? Serão links para outras páginas Feliz
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por ZombieW em 06.03.20 14:38

O problema está naquela faixa rosa, não consegui achar o div correto para colocar o texto.

Eu consigo parcialmente assim:

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
        #player_magic .player_status a {
        color: #ff0080;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
        width: 10%;
        margin-left: 169%;
        margin-top: -25px;
        color: #1a222a;
        font-weight: 300;
        font-family: sans-serif;
        font-size: 12px;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>         

<div id="player_magic">
   <strong class="player_title">Story</strong>

   <div class="player_status">
      <p>
         <a href="/pid=1">Summary</a>
      </p>

      <div class="player_desc">
         <p>
            <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>
         </p>
      </div>
      
      <div align="left">
         <br />Season 1 * Season 2 * Season 3 * Season 4
      </div>
      
      <div align="center">
         <br /><iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 200%; height: 900px;"></iframe>
      </div>
   </div>
</div>

Porém, é sem os links...

Se eu mudar para os links, os textos ficam quebrados em linhas, talvez por causa de como o DIV está configurado.

Talvez o Pedxz consiga ajudar melhor.

Eu particularmente não gosto de iframes... Caso queira ver como faço no meu site (e queira alguma orientação de qualquer trecho, só solicitar), acesse: https://tutorialdoca.forumeiros.com/

Eu trabalho agora só com páginas HTML também. xD
ZombieW

ZombieW
Membro do Fórum

Masculino
Inscrito dia : 02/08/2010
Mensagens : 1453
Pontos Ativos : 2023

http://www.perfectteam.org

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 07.03.20 21:21

Eu também não sou grande fã de iframes mas queria dar um ponto de acesso aos fóruns e às páginas que criei na forumeiros também no meu blog, e esta é uma ideia rápida e eficaz. Feliz
Eu vou dar uma vista de olhos no código que me deu a ver se consigo resolver. Mas muito obrigado pela ajuda! <3

Update: Não consegui, agora é rezar para que o Pedxz veja e nos salve. Mesmo assim, uma vez mais muito obrigado pela ajuda <3
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por pedxz em 08.03.20 15:22

Veja se ficou como pretendido:
Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
        #player_magic .player_status a {
        color: #ff0080;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
        width: 10%;
        margin-left: 151%;
        margin-top: -25px;
        color: #1a222a;
        font-weight: 300;
        font-family: sans-serif;
        font-size: 12px;
        }
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>       
 
<div id="player_magic">
  <strong class="player_title">Story</strong>
 
  <div class="player_status">
      <p>
        <a href="/pid=1">Summary</a>
      </p>
 
      <div class="player_desc">
        <p>
            <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>
        </p>
      </div>
     
      <div class="player_tabs">
        <ul><li><a href="#">Season 1</a></li> * <li><a href="#">Season 2</a></li> * <li><a href="#">Season 3</a></li> * <li><a href="#">Season 4</a></li></ul>
      </div>
     
      <div class="player_txt">
        <iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 200%; height: 900px;"></iframe>
      </div>
  </div>
</div>


Boas-vindas ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a editando a sua primeira postagem.
Pedxz - Moderadeiro
pedxz

pedxz
Moderadeiro
Moderadeiro

Outro / Não divulgar
Inscrito dia : 13/01/2017
Mensagens : 5212
Pontos Ativos : 6143

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 08.03.20 17:37

Quase! x)
Tentei fazer umas pequenas mudanças e desconfigurou tudo, existe forma de mexer onde diz "Season 1/ 2" e deixar o resto intacto?
Confira: https://online--winxclub.forumotion.com/h69-summary-en-html

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
        #player_magic .player_status a {
        color: #ff0080;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
        width: 10%;
        margin-left: 151%;
        margin-top: -25px;
        color: #1a222a;
        font-weight: 300;
        font-family: sans-serif;
        font-size: 12px;
        }
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>       
<div id="player_magic">
     <strong class="player_title">Story</strong>   
   <div class="player_status">
           
      <p>
                 <a href="/pid=1">Summary</a>     
      </p>
             
      <div class="player_desc">
                
         <p>
                        <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>       
         </p>
              
      </div>
                 
      <div class="player_tabs">
                
         <ul>
            <li>
               <a href="#">SEASON 1</a>
            </li>
             ★
            <li>
               <a href="#">SEASON 2</a>
            </li>
             ★
            <li>
               <a href="#">SEASON 3</a>
            </li>
             ★
            <li>
               <a href="#">SEASON 4</a>
            </li>
         </ul>
              
      </div>
                 
      <div class="player_txt">
                 <iframe style="width: 200%; height: 900px;" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" marginwidth="0" marginheight="0" scrolling="yes" frameborder="0"></iframe>     
      </div>
       
   </div>
</div>

Uma última coisa era que eu tentei mudar a cor de onde diz "Back" para esta #1a222a mas por algum motivo continua cor-de-rosa. Existe forma de corrigir?
Muito obrigado pela ajuda, Pedxz! Muito feliz
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 09.03.20 21:37

up
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 10.03.20 23:54

up
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 13.03.20 13:18

up
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por Chagas em 14.03.20 12:59

Bom dia, @juleic1123

Vamos usar o código HTML do @Pedxz alterado:

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
        #player_magic .player_status a {
        color: #000;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
        width: 10%;
        margin-left: 151%;
        margin-top: -25px;
        color: #1a222a;
        font-weight: 300;
        font-family: sans-serif;
        font-size: 12px;
        }
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>     
 
<div id="player_magic">
  <strong class="player_title">Story</strong>
 
  <div class="player_status">
      <p>
        <a href="/pid=1">Summary</a>
      </p>
 
      <div class="player_desc">
        <p>
            <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>
        </p>
      </div>
   
      <div class="player_tabs">
        <ul><li><a href="#">Season 1</a></li> * <li><a href="#">Season 2</a></li> * <li><a href="#">Season 3</a></li> * <li><a href="#">Season 4</a></li></ul>
      </div>
   
      <div class="player_txt">
        <iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 200%; height: 900px;"></iframe>
      </div>
  </div>
</div>

Agora, tenho que te ressaltar que às vezes alguma página HTML buga, quando você edita no modo simples (WYSIWYG) e quando você acaba salvando, vários códigos são "comidos" e acabam essa textura. Por isso é recomendado que você modifique uma página no modo avançado (HTML). Agora o senhor se quiser mexer somente no código dos títulos, deve mexer nesse código citado:

<div class="player_tabs">
<ul><li><a href="#">Season 1</a></li> * <li><a href="#">Season 2</a></li> * <li><a href="#">Season 3</a></li> * <li><a href="#">Season 4</a></li></ul>
</div>

É importante ressaltar que não deve eliminar a classname "player_tabs" bem como os que fecham o código inteiro, bem como "</div>", senão você pode causar uma confusão e um /div depois tentará fechar isso e acabando de fazer uma bagunça de largura e outras questões afim.

Atenciosamente,
Wamki
Chagas

Chagas
Usuário destaque

Masculino
Inscrito dia : 22/10/2015
Mensagens : 749
Pontos Ativos : 925

https://pelotao.forumeiros.com

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 18.03.20 1:23

Olá! Obrigado pelo conselho de usar em modo avançado! Quanto ao código que me fez, o erro persiste. Se eu modificar as partes que dizem "Season 1, Season 2, Season 3...", o iframe e a palavra "Back" saiem do sitio, queria ver se havia maneira de arrumar para que eu pudesse mudar o texto e deixar tudo no sítio <3

Um novo problema que surgiu foi que agora a palavra "Summary" ficou a preto junto com o botão Back, se desse para arrumar, ficava agradecido <3 https://online--winxclub.forumotion.com/h69-summary-en-html
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por Roevs em 18.03.20 11:38

Olá,

Substitua o código da página por esse

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
#player_magic .player_txt {
    padding: 0 1.2rem;
    display: block;
    position: relative;
    text-align: justify;
    line-height: normal;
    width: 611px;
    word-break: break-word;
}
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
    line-height: 47px;
    position: relative;
    float: left;
    margin: 27px 2px;
    font-size: 0.90em;
}
        #player_magic .player_status a {
        color: #000;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
    width: 10%;
    margin-left: 76.4%;
    margin-top: -25px;
    color: #1a222a;
    font-weight: 300;
    font-family: sans-serif;
    font-size: 12px;
}
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>   
 
<div id="player_magic">
  <strong class="player_title">Story</strong>
 
  <div class="player_status">
      <p>
        <a href="/pid=1">Summary</a>
      </p>
 
      <div class="player_desc">
        <p>
            <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>
        </p>
      </div>
 
      <div class="player_tabs">
        <ul><li><a href="#">Season 1</a></li> * <li><a href="#">Season 2</a></li> * <li><a href="#">Season 3</a></li> * <li><a href="#">Season 4</a></li></ul>
      </div>
 
    <div class="player_txt"><span style="color: #0d479d;"><span style="font-family: Arial;"><span style="font-size: 12px;">
An ordinary girl from Planet Earth, Bloom lives a perfectly normal life in the city of Gardenia until she meets Stella, a Princess from the planet Solaria, who is in trouble. Going to Stella's aid, Bloom discovers her magical powers. Stella persuades Bloom to join Alfea, the best fairy school in all the realms. In Alfea, Bloom forms Winx Club, whose members are her four friends and roommates - Stella, Musa, Tecna, and Flora. Later, they encounter and befriend the Specialists - Brandon, Riven, Timmy, and Sky, who will also become their love interests. The Winx Club members also encounter a trio of witches from Cloud Tower - Icy, Darcy and Story, who are known as Trix. Trix are in search of the power of the Dragon's Flame and their ruthless pursuit lead to many encounters and battles with Winx Club. Bloom also begins to learn the secrets of her planet, parents, and powers.</span></span></span></div>
  </div>
</div>

Coloquei o texto diretamente no código, em vez da utilização do iframe.

Até mais!
Roevs

Roevs
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 10/02/2012
Mensagens : 6282
Pontos Ativos : 8064

https://www.sololevelingrpg.com/

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 20.03.20 1:56

Funcionou!
Só tenho uma última questão, a cor preta de "Back" continua no texto "Summary", dá para arrumar para o cor de rosa do restante? Só o texto que diz "Back" deveria estar a preto <3 Obrigado! Feliz

P.S - Se eu usar iframe com o código atual, vai bugar de novo? É que eu planejo usar estes códigos para fazer páginas parecidas com iframe e tenho medo de ter de reabrir um tópico para algo que acabará por ser tão parecido a este.
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por Roevs em 20.03.20 1:59

Olá,

Retorne o código com o iframe para eu fazer as alterações nele.

Até mais!
Roevs

Roevs
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 10/02/2012
Mensagens : 6282
Pontos Ativos : 8064

https://www.sololevelingrpg.com/

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 20.03.20 2:41

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />      <style type="text/css">
#player_magic .player_txt {
    padding: 0 1.2rem;
    display: block;
    position: relative;
    text-align: justify;
    line-height: normal;
    width: 611px;
    word-break: break-word;
}
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
    line-height: 47px;
    position: relative;
    float: left;
    margin: 27px 2px;
    font-size: 0.90em;
}
        #player_magic .player_status a {
        color: #000;
        line-height: 10px;
        font-weight: bolder;
        font-family: Arial;
        text-decoration: none;
        width: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        }
        #player_magic .player_desc {
    width: 10%;
    margin-left: 76.4%;
    margin-top: -25px;
    color: #1a222a;
    font-weight: 300;
    font-family: sans-serif;
    font-size: 12px;
}
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>   
<div id="player_magic">
     <strong class="player_title">Story</strong>   
   <div class="player_status">
           
      <p>
                 <a href="/pid=1">Summary</a>     
      </p>
             
      <div class="player_desc">
                
         <p>
                        <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>       
         </p>
              
      </div>
             
      <div class="player_tabs">
                
         <ul>
            <li>
               <a href="#">SEASON 1</a>
            </li>
             *
            <li>
               <a href="#">SEASON 2</a>
            </li>
             *
            <li>
               <a href="#">SEASON 3</a>
            </li>
             *
            <li>
               <a href="#">SEASON 4</a>
            </li>
         </ul>
              
      </div>
           
      <div class="player_txt">
        <iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 100%; height: 900px;"></iframe>
      </div>
       
   </div>
</div>

Aqui tem!
Muito obrigado pela ajuda, mais uma vez <3
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por Roevs em 20.03.20 11:01

Olá,

Substitua o código por esse

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
body {
    text-align: justify!important;
}
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
#player_magic .player_status a {
    color: #ff1c7f;
    line-height: 10px;
    font-weight: bolder;
    font-family: Arial;
    text-decoration: none;
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#player_magic .player_desc {
    width: 10%;
    margin-left: 505px;
    margin-top: -23px;
    color: #1a222a;
    font-weight: 300;
    font-family: sans-serif;
    font-size: 12px;
}
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style>   
 
<div id="player_magic">
  <strong class="player_title">Story</strong>
 
  <div class="player_status">
      <p>
        <a href="/pid=1">Summary</a>
      </p>
 
      <div class="player_desc">
        <p>
            <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>
        </p>
      </div>
 
      <div class="player_tabs">
        <ul><li><a href="#">Season 1</a></li> * <li><a href="#">Season 2</a></li> * <li><a href="#">Season 3</a></li> * <li><a href="#">Season 4</a></li></ul>
      </div>
 
      <div class="player_txt">
        <iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 610px; height: 900px;"></iframe>
      </div>
  </div>
</div>

Até mais!
Roevs

Roevs
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 10/02/2012
Mensagens : 6282
Pontos Ativos : 8064

https://www.sololevelingrpg.com/

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por juleic1123 em 20.03.20 18:24

Quase perfeito, mas eu acho que não me estou fazendo entender no quesito das cores Rindo

Você arrumou a cor da palavra "Summary" para rosa, mas acabou mudando a cor da palavra "Back" kkk, back é suposto ficar preto para se destacar no botão. É a única coisa que falta arrumar. Tentei mas não está funcionando >-<

Obrigado pela ajuda <3
juleic1123

juleic1123
Usuário destaque

Masculino
Inscrito dia : 04/05/2011
Mensagens : 656
Pontos Ativos : 912

http://www.online-winxclub.com/forum

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por Roevs em 20.03.20 19:18

Olá,

Substitua o código por esse

Código:
<!--                Required meta tags                -->      <meta charset="utf-8" />      <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport" />      <style type="text/css">
        #player_magic {
        background: #ffffff url(https://1.bp.blogspot.com/-efOIKXqcVLE/XlyJFUwzAFI/AAAAAAAAMEk/aOob1e2VymEAK9Z-vYfShoZuogcSCkbqgCLcBGAsYHQ/s1600/Boarder%2Bsynopsis.png);
        width: 667px;
        height: 845px;
        max-width: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        position: relative;
        }
body {
    text-align: justify!important;
}
        #player_magic .player_title {
        color: #ff0080;
        height: 22px;
        font-size: 1.59em;
        font-family: Arial;
        line-height: 70px;
        margin-left: 20px;
        }
 
        #player_magic .player_status {
        line-height: 47px;
        position: absolute;
        float: left;
        margin: 27px 2px;
        font-size: 0.90em;
        }
.player_desc a strong {
    color: black!important;
}
#player_magic .player_status a {
    color: #ff1c7f;
    line-height: 10px;
    font-weight: bolder;
    font-family: Arial;
    text-decoration: none;
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#player_magic .player_desc {
    width: 10%;
    margin-left: 505px;
    margin-top: -23px;
    color: #1a222a;
    font-weight: 300;
    font-family: sans-serif;
    font-size: 12px;
}
        #player_magic .player_txt {
        padding: 0 1.2rem;
        display: block;
        position: relative;
        }
        #player_magic .player_tabs ul {
        line-height: 55px;
        }
        #player_magic .player_tabs ul li, #player_magic .player_tabs ul li a {
        display: inline!important;
        }
        #player_magic .player_tabs ul li a {
        color: white!important;
        }
        @media (max-width: 350px) {
        #player_magic .player_title {
        line-height: 28px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 15px -20px;
        }
        #player_magic .player_status a {
        line-height: 36px;
        font-size: .75rem;
        }
        }
        @media (width: 425px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0px -5px;
        }
        #player_magic .player_status a {
        line-height: 70px;
        font-size: .75rem;
        }
        }
        @media (width: 375px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 -20px;
        }
        #player_magic .player_status a {
        line-height: 40px;
        font-size: .75rem;
        }
        }
        @media (width: 768px) {
        #player_magic .player_title {
        line-height: 48px;
        font-size: 1.2em;
        }
        #player_magic .player_status {
        margin: 0 40px;
        }
        #player_magic .player_status a {
        line-height: 100px;
        font-size: .75rem;
        }
        }
      </style> 
 
<div id="player_magic">
  <strong class="player_title">Story</strong>
 
  <div class="player_status">
      <p>
        <a href="/pid=1">Summary</a>
      </p>
 
      <div class="player_desc">
        <p>
            <a href="https://online--winxclub.forumotion.com/h16-story-html"><strong>Back</strong></a>
        </p>
      </div>
 
      <div class="player_tabs">
        <ul><li><a href="#">Season 1</a></li> * <li><a href="#">Season 2</a></li> * <li><a href="#">Season 3</a></li> * <li><a href="#">Season 4</a></li></ul>
      </div>
 
      <div class="player_txt">
        <iframe frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://winxclubmagazine.forumotion.com/h2-story-s1-en" style="width: 610px; height: 900px;"></iframe>
      </div>
  </div>
</div>

Até mais!
Roevs

Roevs
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 10/02/2012
Mensagens : 6282
Pontos Ativos : 8064

https://www.sololevelingrpg.com/

Atendido / Resolvido Re: Problema com criação de nova página HTML

Mensagem por Chagas em 25.03.20 15:56

Tópico resolvido


Tópico marcado como resolvido pela equipe por abandono do autor.
Chagas

Chagas
Usuário destaque

Masculino
Inscrito dia : 22/10/2015
Mensagens : 749
Pontos Ativos : 925

https://pelotao.forumeiros.com

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


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