Banner fica com a imagem distorcida

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

Atendido / Resolvido Banner fica com a imagem distorcida

Mensagem por EDU2010 03.05.19 3:18

Detalhes da questão


Endereço do fórum: http://isadorapompeo.forumeiros.com/
Versão do fórum: ModernBB

Descrição


A imagem quando coloco fica distorcida , estou colocando pela folha de estilho CSS

Segue imagem original
Banner fica com a imagem distorcida  Isa10



Como esta ficando
Banner fica com a imagem distorcida  110


Meu CSS Atual

Código:
#logo {
float: none !important;
}
.navbar {
text-align: center !important;
margin-top: -285x !important;
}
/******logo tamanho*****/
#logo {
display: none !important;
}
.headerbar {
    background-color: #FFFAFA!important;
    background-image: url(https://i.servimg.com/u/f39/15/98/91/46/d873f410.jpg)!important;
    height: 250px!important;
    background-position: top!important;
}
/*******fim logo tamanho ******/

.mod-top-row .mod-top-desc {
    bottom: 0;
    font-size: 1.1rem;
    height: 24px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    background-color: #FF0303;
}

/***** centralizar baixo e cima botão buscar *******/
#search-box {
margin-top: 160px !important;
}
/***** fim centralizar baixo e cima botão buscar *******/

#search-box #keywords {
    background-color: grey !important;
}

/*** ocultar menu****/
a.mainmenu[href="/calendar"], [href="/faq"], [href="/groups"], [href="/register"], [href="/memberlist"], [href=""], [href="/search"], [href="/profile?mode=editprofile"], [href=""], [href="/gallery/index.htm"]
{display: none !important}
a#logout {display: none !important;}


/****m fim ocultar menu******/


/******* cor fundo wiget ********/
.module {
background-color:#C1CDCD !important
}

/******** fim da fundo de widget *********/

/***** cor barra  widget *******/
.module .h3 {
    background-color: #3B5995!important;
}

/****** fim cor barra wifget *****/

/******  tirar cor fundo onde fica banner ******/
.headerbar {
    background-color: #EEE9E9!important;
  }

  /******* fim retirar cor banner *****/
 


/***** ACERTAR TAMANHO BANNER *****/
.headerbar {
  width: 100% !important;
  background-size:100% 100% !important;
}
/******* FIM ACERTAR BANNER ******/

/**** imagem se ajustarem *****/
a img,
.module img {
  max-width: 100%!important;
  height: auto!important;
}


/**** imagem fim se ajustarem ****/
EDU2010

EDU2010
Usuário experiente

Masculino
Inscrito dia : 09/12/2010
Mensagens : 2272
Pontos Ativos : 3556

http://passarinhos.forumeiros.com/forum.htm

Atendido / Resolvido Re: Banner fica com a imagem distorcida

Mensagem por EDU2010 04.05.19 13:55

Alguem ai , ajuda .............. Welcome FdF
EDU2010

EDU2010
Usuário experiente

Masculino
Inscrito dia : 09/12/2010
Mensagens : 2272
Pontos Ativos : 3556

http://passarinhos.forumeiros.com/forum.htm

Atendido / Resolvido Re: Banner fica com a imagem distorcida

Mensagem por First 07.05.19 5:46

Olá @EDU2010,

Aparentemente não tem problemas com o seu código CSS, o problema persiste na qualidade da imagem, por isso a 'distorção' da imagem e a péssima resolução. Recomendo-o que faça uma nova imagem, com uma qualidade, proporção e tamanho maior, assim, poderemos modificar a imagem com códigos.

Espero ter sido claro e especifico.


Atenciosamente,
First.
First

First
Membro do Fórum

Masculino
Inscrito dia : 13/07/2013
Mensagens : 1292
Pontos Ativos : 1848

http://www.ajuda.forumeiros.com https://www.facebook.com//victor.jagata

Atendido / Resolvido Re: Banner fica com a imagem distorcida

Mensagem por Roevs 07.05.19 20:41

Olá,

Substitua o seu CSS por esse

Código:
#logo {
float: none !important;
}
.navbar {
text-align: center !important;
margin-top: -285x !important;
}
/******logo tamanho*****/
#logo {
display: none !important;
}
.headerbar {
    background-color: #FFFAFA!important;
    background-image: url(https://i.servimg.com/u/f39/15/98/91/46/d873f410.jpg)!important;
    height: 250px!important;
    background-position: top!important;
}
/*******fim logo tamanho ******/
 
.mod-top-row .mod-top-desc {
    bottom: 0;
    font-size: 1.1rem;
    height: 24px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    background-color: #FF0303;
}
 
/***** centralizar baixo e cima botão buscar *******/
#search-box {
margin-top: 160px !important;
}
/***** fim centralizar baixo e cima botão buscar *******/
 
#search-box #keywords {
    background-color: grey !important;
}
 
/*** ocultar menu****/
a.mainmenu[href="/calendar"], [href="/faq"], [href="/groups"], [href="/register"], [href="/memberlist"], [href=""], [href="/search"], [href="/profile?mode=editprofile"], [href=""], [href="/gallery/index.htm"]
{display: none !important}
a#logout {display: none !important;}
 
 
/****m fim ocultar menu******/
 
 
/******* cor fundo wiget ********/
.module {
background-color:#C1CDCD !important
}
 
/******** fim da fundo de widget *********/
 
/***** cor barra  widget *******/
.module .h3 {
    background-color: #3B5995!important;
}
 
/****** fim cor barra wifget *****/
 
/******  tirar cor fundo onde fica banner ******/
.headerbar {
    background-color: #EEE9E9!important;
  }
 
  /******* fim retirar cor banner *****/
 
 
 
/***** ACERTAR TAMANHO BANNER *****/
.headerbar {
  width: 100% !important;
  background-size: auto!important;
}
/******* FIM ACERTAR BANNER ******/
 
/**** imagem se ajustarem *****/
a img,
.module img {
  max-width: 100%!important;
  height: auto!important;
}
 
 
/**** imagem fim se ajustarem ****/

Até mais!


Banner fica com a imagem distorcida  WpZJdpr
Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento 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 clicando no botão resolvido para organizar o fórum.
Roevs

Roevs
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 10/02/2012
Mensagens : 6468
Pontos Ativos : 8293

https://www.sololevelingrpg.com/

Atendido / Resolvido Re: Banner fica com a imagem distorcida

Mensagem por EDU2010 08.05.19 1:20


Só que não ficou a tela toda , ficou apenas no centro desta forma que fez ...
EDU2010

EDU2010
Usuário experiente

Masculino
Inscrito dia : 09/12/2010
Mensagens : 2272
Pontos Ativos : 3556

http://passarinhos.forumeiros.com/forum.htm

Atendido / Resolvido Re: Banner fica com a imagem distorcida

Mensagem por Roevs 08.05.19 12:56

Olá,

Substitua a sua Folha de estilo CSS pela abaixo

Código:
#logo {
float: none !important;
}
.navbar {
text-align: center !important;
margin-top: -285x !important;
}
/******logo tamanho*****/
#logo {
display: none !important;
}
.headerbar {
    background-color: #FFFAFA!important;
    background-image: url(https://i.servimg.com/u/f39/15/98/91/46/d873f410.jpg)!important;
    height: 250px!important;
    background-position: top!important;
}
/*******fim logo tamanho ******/
 
.mod-top-row .mod-top-desc {
    bottom: 0;
    font-size: 1.1rem;
    height: 24px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    background-color: #FF0303;
}
 
/***** centralizar baixo e cima botão buscar *******/
#search-box {
margin-top: 160px !important;
}
/***** fim centralizar baixo e cima botão buscar *******/
 
#search-box #keywords {
    background-color: grey !important;
}
 
/*** ocultar menu****/
a.mainmenu[href="/calendar"], [href="/faq"], [href="/groups"], [href="/register"], [href="/memberlist"], [href=""], [href="/search"], [href="/profile?mode=editprofile"], [href=""], [href="/gallery/index.htm"]
{display: none !important}
a#logout {display: none !important;}
 
 
/****m fim ocultar menu******/
 
 
/******* cor fundo wiget ********/
.module {
background-color:#C1CDCD !important
}
 
/******** fim da fundo de widget *********/
 
/***** cor barra  widget *******/
.module .h3 {
    background-color: #3B5995!important;
}
 
/****** fim cor barra wifget *****/
 
/******  tirar cor fundo onde fica banner ******/
.headerbar {
    background-color: #EEE9E9!important;
  }
 
  /******* fim retirar cor banner *****/
 
 
 
/***** ACERTAR TAMANHO BANNER *****/
.headerbar {
  width: 100% !important;
  background-size: cover!important;
}
/******* FIM ACERTAR BANNER ******/
 
/**** imagem se ajustarem *****/
a img,
.module img {
  max-width: 100%!important;
  height: auto!important;
}
 
 
/**** imagem fim se ajustarem ****/

Até mais!


Banner fica com a imagem distorcida  WpZJdpr
Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento 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 clicando no botão resolvido para organizar o fórum.
Roevs

Roevs
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 10/02/2012
Mensagens : 6468
Pontos Ativos : 8293

https://www.sololevelingrpg.com/

Atendido / Resolvido Re: Banner fica com a imagem distorcida

Mensagem por Convidado 13.05.19 13:50

Questão abandonada

Esta questão foi abandonada pelo seu autor, mas foi considerada resolvida pela equipa de suporte.


De acordo com o regulamento do setor de suporte, Art. 5/Deveres, tópicos com 5 dias serão arquivados. Apesar de abandonado, este tópico tem uma solução e portanto será marcado como resolvido e movido para o arquivo de questões resolvidas.
Anonymous

Convidado
Convidado


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