Background não centraliza corretamente

[lucazbrandao 0]

Olá comunidade, 

 

No site que estou desenvolvendo eu criei um background com 3 imagens, top, bottom e center, ambas tem 1920 de largura.

Meu código:

body {
  width: 100%;
  background: url(../images/top-fon-bg.jpg) top center no-repeat, url(../images/bottom-fon-bg.jpg) bottom center no-repeat, url(../images/fon-repeat.jpg) center repeat-y;
  background-color: #000000;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 12px;
  color: #7d7d7d;
  line-height: 1;
  min-height: 100vh; 
}

O problema é que a imagem do centro não fica centralizada, parece que ela se move 1 pixel pro lado.

 

 

 

Alguém sabe o que pode ser? Obrigado.

[T-Rexz 0]

Duas coisas:

Uma - Dps que fui testar usando a sua script, não entendi o porque apenas nesta "url(../images/fon-repeat.jpg) center repeat-y" se repetir?

Duas - A script que me passou está só mostrando verticalmente ao invés do exemplo da imagem em preto que você postou aí.

 

Bom... para que este comando "url(../images/bottom-fon-bg.jpg) bottom center no-repeat" fique no "meio", eu só removi o bottom e deixei apenas o center, lembrando-se que top é cima, center é meio (ou centro) e bottom é baixo. Daí com as 3 imagens, fiz assim: a primeira é top, a segunda é center e a terceira bottom.

Veja o exemplo visual na print que ajustei pra ver se é isso que queria?

 

Sua script:

 

Script ajustada (além de remover o bottom que estava "bottom center" que especificei acima, fora que removi tb o repeat-y da imagem do bottom só para dar um exemplo visual):

 

É isso que queria??

 

Só um LEMBRETE para a moderação do fórum: meu tópico criado dia 19 já completou uma semana no "AGUARDANDO APROVAÇÃO" e AINDA não foi liberado, preciso que meu tópico seja liberado para ser visualizado por outros pra tentar resolver o meu problema que estou enfrentando há mais de 1 semana!! Segue o link do meu tópico: https://forum.imasters.com.br/topic/583977-div-some-após-selecionar-uma-opção-de-seleção/

Já mandei e-mail / contato, porém nunca foi respondido até hoje. Por favor, moderação, dá uma força pro camarada aê.

Editado Agosto 26, 2019 por T-Rexz

[lucazbrandao 0]

Salve T-Rexz,  eu notei que esse bug só ocorre em algumas resoluções, a minha é 1920x1080 (usando o chrome) e ocorre, em algumas menores não ocorre.

 

Reproduzindo algo parecido com o seu exemplo que me veio na cabeça aqui, eu percebi uma coisa..  O comando repeat-y tá distorcendo um pouco a qualidade da imagem (não faço ideia do motivo), fazendo ocorrer esse mini bug.. 

No meu projeto, eu criei o background inteiro do site no photoshop, que tem esse menu com a borda dourada, nesse exemplo da imagem é o encontro da imagem do topo com a do meio... Eu separei o background em três partes (as 3 possuem um pedaço do menu dourado), uma top (cabeçalho), bottom(rodapé) e esta 'fon-repeat' no centro, que vai se multiplicando em cada página em uma quantidade diferente, pois as páginas não tem o mesmo tamanho.. 

[Maujor 144]

Em 26/08/2019 at 09:58, T-Rexz disse:

Segue o link do meu tópico: https://forum.imasters.com.br/topic/583977-div-some-após-selecionar-uma-opção-de-seleção/

Este link está quebrado.
Poste sua dúvida novamente.

[Omar~ 87]

@lucazbrandao Tente:

background-position:center;

margin:0;

padding:0;

box-sizing:border-box

 

 

@T-Rexz Poste no lugar certo que não terá problema....

[lucazbrandao 0]

Em 28/08/2019 at 18:03, Omar~ disse:

@lucazbrandao Tente:

background-position:center;

margin:0;

padding:0;

box-sizing:border-box

 

 

Poxa, deu na mesma aqui.. descobri que o problema realmente é por causa do repeat-y, ele tá fazendo a imagem ficar um pouco borrada, e dando essa impressão de desalinhamento do menu.. 
Tô pensando em criar alguns tamanhos de background fixos e colocar em cada página o tamanho que for necessário kkkk (muita gambiarra).

[T-Rexz 0]

Em 28/08/2019 at 16:22, Maujor disse:

Este link está quebrado.
Poste sua dúvida novamente.

 

Ele não está quebrado, aqui abre a página do tópico normalmente... só que não está "visível" pro público (só eu mesmo que consigo ver o tópico, pois eu mesmo criei o tópico), pq mostra uma exclamação antes do título do tópico dizendo assim "Aguardando aprovação", será que deu bug no tópico que não aparece para a moderação e terei que fazer um novo tópico??

 

 

@Omar~

Postei no lugar certo, pois é sobre as divs que estão na seção HTML e CSS, só que nunca saiu do "Aguardando aprovação". Acho que vou ter que criar um novo tópico que vai ser o jeito, pois deve ter dado um bug que não aparece para a moderação.

Editado Setembro 2, 2019 por T-Rexz
Colocar outra citação no mesmo post