Código html não funciona

Item: Código html não funciona
Rating: 1

por Virginia 28.01.15 23:49

Detalhes da dúvida

Versão do fórum : phpBB2
Nível de acesso : Fundador
Navegador usado : Mozilla Firefox
Imagem :

Imagem da minha dúvida:

Membros afetados : Todos os membros do fórum
Endereço do fórum : http://heroes.justboard.net

Descrição do problema

Gostaria de saber porque o div onde se encontra o conteúdo do "CRIAÇÂO DE PERSONAGEM" não fica na mesma linha dos outros.

Segue o código:

Código:: <div style="width:1018px; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:759px;width:259px;height:250px;"><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div></div></div>

por EuficoLoko 29.01.15 2:01

Olá!

No código procure por 'padding-top', serve para subir e descer.
Olhe o style da div interno:

Código:: <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div>

padding-top: 10px;
Quanto mais aumentar, mais ele desce. Se tiver o sinal - na frente, se aumentar ele irá subir.

por Virginia 29.01.15 20:19

Sim, mas esse padding-top se refere ao texto CRIAÇÃO DE PERSONAGEM; e mesmo assim, o div fica 250px abaixo, não apenas 10px.

por Sennior 29.01.15 20:27

Saudações,

Amigo, tente colocar essa classe dentro da div:

Código:: position: fixed;

Se não souber, nos avise.
Até mais.

por Virginia 29.01.15 20:30

Olá, realmente posicionou no lugar correto. Porém, aparentemente, ela está "atrás" da primeira DIV, como segue no print:

Código html não funciona Dawddw11

por Sennior 29.01.15 20:35

Tá, mas me explique aqui que eu estou meio errado hoje Louco

A imagem que esta atrás da aba Criações de Personagens é que tem que sair?

Abraços. De bem com a vida

por Virginia 29.01.15 20:38

Concordo que ficou meio difícil de entender, haha. Mas é porquê o conteúdo das duas divs internas são iguais, eu vou mudar futuramente, quero só a "armação" do código.

Mas, considerando que as duas divs têm o mesmo conteúdo, o objetivo seria esse:
Código html não funciona Dawddw12

por Sennior 29.01.15 20:42

Saudações,

Então, poderíamos criar Classes especificas e adicionar a propriedade?
No caso, o senhor deseja que cada imagem fique atrás dos textos então é só criar uma Classe dentro da div para mexer com a imagem, ou com erro que esta causando isso.

Poderia ser assim?
Até mais.

por Virginia 29.01.15 20:45

Então, eu não entendo muito de html, apenas mexo um pouco, haha. Mas, explicando de meu modo: eu criei três DIVs, um com a primeira imagem (dos caras sentados), e mais dois iguais: com aquele imagem cinza de fundo e seu conteúdo de texto nela.

Basicamente: DIV DIV DIV. O problema é que o terceiro div não está aparecendo, nem seu background nem seu conteúdo dentro. E antes estava, porém em baixo, como no print do primeiro post. Não é apenas o background o erro, e sim todo o div.

E, se for necessário criar classes (o que acho que não), a vontade, só quero que resolva! haha

por Sennior 29.01.15 20:50

Boas,

Então, mande-me o código completo do seu código HTML.
Até.

por Virginia 29.01.15 20:57

Código:: <div style="width:1018px; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div><div style="position: fixed; BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:759px;width:259px;height:250px;"><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div></div></div>

por Sennior 29.01.15 21:04

É... Não entendi, mas creio que o erro seja este.
Altere pelo abaixo:

Código:: <div style="background-repeat: no-repeat; width:1018px; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div> <div style=" position: fixed; BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:759px;width:259px;height:250px;"><div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div></div></div>

É isso?
Se não for, peço desculpas e peço que me explique novamente.
Até mais.

por Virginia 29.01.15 21:09

Então, pelo que li do código você entendeu o que eu quero.
Mas, o resultado nao foi o esperado, com seu código, ficou assim:
Código html não funciona Fast11

Novamente, "sumiu" o terceiro div.

por Sennior 29.01.15 21:20

E agora?

Código:: <div style="width:1018px;background-repeat: no-repeat; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div> <div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div></div></div>

Até mais.

por Virginia 29.01.15 22:26

Em baixo, no canto esquerdo...

Código html não funciona Fsfefs10

por Sennior 29.01.15 22:35

No caso retirar ajudaria?

Código:: <div style="width:1018px;background-repeat: no-repeat; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div>

Até mais.

por Virginia 29.01.15 22:42

Não, meu grande dilema é fazer estes três aparecerem um ao lado do outro.
Se quiseres reescrever o código do zero, como quiseres, claro que pode, desde que funcione, e estes três continuem ao lado um do outro nessa sequencia. E pra que eu posso editar o texto depois. haha

Como segue na imagem, o objetivo:
Código html não funciona Hahaha10

por Sennior 29.01.15 22:43

É eu to sem poderes de compreendimento hoje Mostrando a lingua

Código:: <div style="width:1018px;background-repeat: no-repeat; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div> --------------------- <div style="width:1018px;background-repeat: no-repeat; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div>

Assim no caso?

por Virginia 29.01.15 22:47

Cara... Não sei mais como explicar. kkk
Olhe, o objetivo é ficar ASSIM:
Código html não funciona Dawddw12

Tente fazer algo assim, e digo se é o que quero... Por favor, claro. haha

por Sennior 29.01.15 22:51

kkkkkk Assim?

Código:: <div style="width:1018px;background-repeat: no-repeat; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div> <div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:755px;position:relative;top:-250px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div>

Até mais.

por Virginia 29.01.15 22:54

Então... "Bugou". kkk

Código html não funciona Hahaha11

por Sennior 29.01.15 22:55

Mas no caso é isto mesmo? A 2° barra de personagem ao lado da primeira?
Até mais.

por Virginia 29.01.15 22:58

Sim, mas na mesma posição vertical, reta com ela... Essa aí está mais em baixo.

por Sennior 30.01.15 4:59

Pois bem, se é isso:

Código:: <div style="width:1018px;background-repeat: no-repeat; height:250px; BACKGROUND-image:url('http://i60.tinypic.com/34fe1yc.png');"><div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:500px;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div> <div style="width:518px; height:250px;"><div style="BACKGROUND-image:url('http://i57.tinypic.com/atlyys.jpg');margin-left:755px;position:relative;top:ALTERE AQUI O VALOR SEMPRE NEGATIVOpx;width:259px;height:250px;"> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: 'Roboto Condensed'; font-size: 16px"><strong><a class="postlink" href="http://heroes.justboard.net/f4-criacao-de-personagem">CRIAÇÃO DE PERSONAGEM</a></strong></div> <div style="margin:auto; padding-top: 10px; padding-left: 10px; padding-right: 16px; font-family: Verdana; font-size: 12px; line-height: 150%; text-align:justify;">Aqui é onde você cria seu personagem. Postando fichas AQUI, seguindo ESTE modelo, você pode criar seu personagem do zero, atribuindo os poderes e habilidades que desejar para ele.</div></div>

Onde esta escrito ALTERE AQUI O VALOR SEMPRE NEGATIVO coloque sempre um valor negativo, exemplo: -350px.
E aí, resultou? De bem com a vida

por Virginia 30.01.15 13:25

Por fim, funcionou. Muito obrigado pela atenção e serviços Sennior!

por EuficoLoko 30.01.15 13:51

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.

Código html não funciona