Ir para conteúdo
Lmdpires

Imagem com espaço no border

Recommended Posts

Olá tenho uma imagem num site com border, só que aparece um espaço na parte inferior da imagem que n percebo porque está a aparecer.

 

O código CSS é o seguinte:

.vencedor_comp_futebol  {
  float: right;
  margin: 20px 0 0 20px;
  border: 2px solid #FFBF00;  
}

 

A imagem q aparece no site está em anexo.

 

Podem ajudar-me?

espaço imagem.PNG

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sem o html é difícil precisar uma resposta.

Pode ser que a imagem tenha height inline que não é do mesmo tamanho do bloco.

Pode ser um espaço em caractere dentro da tag figure (se foi usada).

Pode ser outro bloco se sobrepondo.

Pode ser outras questões do css sobrepondo.

Pode ser propriedade float não foi devidamente encerrada.

Pode ser a própria imagem que tenha essa linha preta no fim

 

Clique com o botão direito do mouse sobre a imagem e selecionar "inspecionar elemento" (Use o Mozila Firefox) então faça uma análise nas definições da imagem e seus parentes que você poderá encontrar a raiz do problema.

 

Porque pelo css postado não há esse tipo de anomalia. (isso se a imagem recebe o classificador vencedor_comp_futebol)

De qualquer forma só com o html para reproduzir a página e analisar o que está causando isso.

Se o website está no ar com essa questão basta informar seu endereço.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Obrigado pela resposta. Depois de pesquisar um display:flex resolveu o problema.

 

ficou assim o código CSS:

 

.vencedor_comp_futebol  {
  float: right;
  margin: 20px 0 0 20px;
  border: 2px solid #FFBF00;  
  display:flex; 
}

 

Obrigado mais uma vez.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por thailangodoy
      Boa tarde amigos,
       
      Quero copiar o efeito hover, que aparece na foto de perfil do login, o qual consiste em uma borda externa, que não influencia no tamanho.
       
      Tentei atribuiu o box-sizing:border-box; // ele diminui a imagem e traz a borda para dentro.
       


    • Por Rasp
      Pessoal, bom dia.
      Estou convertendo um layout de um cliente para responsivo. Durante a jornada, estou tirando vários elementos que foram desenvolvidos com imagens e os convertendo para CSS, porém, estou com uma dúvida: Como fazer um "border radius inverso" (conforme imagem anexo)?
      Lembro de muito tempo atrás ter visto algo semelhante em algum blog (não me lembro se feito com css ou jquery), porém, não consigo encontrar ou não estou sabendo como pesquisar.
       
      Alguém poderia me dar um help?
       
      Obrigado!

    • Por Daniele Prada
      Olá pessoal, Eu queria aplicar nos avatares do meu site, uma borda radial de cor gradiente exatamente como a usada no instagram (imagem). A imagem, a borda está devidamente pronta mas ja tentei VARIOS códigos css e não consegui colocar a cor da borda em degradê como na imagem. Alguém poderia me ajudar?

    • Por caiohaag
      Oi pessoal.
      Estou estudando html e css.
      A pessoa que me ensinou deu a dica de colocar bordas vermelhas nos itens para eu enxergar os tamanhos de cada coisa durante a edição do css, porém eu fiz este projeto, e na hora de remover as bordas ele distorce.
      Se alguém puder me dar uma luz de porque isso está acontecendo, eu fico agradecido.
       
      https://github.com/caiohaag/polo360
       
      Att.
      Caio Haag
    • Por andrebogliari
      Olá pessoal, tudo bem?
       
      Faz um semana que comecei aprender html/css e estou com uma dúvida em relação a utilização do CSS.
       
      Estava estilizando um site com o CSS, quando me deparei com uma "falta de padrão". (ilustrado na FIG.1)
       
      Na FIG. 1 fica difícil de reparar, porém na FIG. 2 que anexei, fica evidente que o tamanho do texto impacta no comprimento da border-top. Entretanto, gostaria que a border-top tivesse um tamanho padrão independente do tamanho do texto que eu digitasse. 
       
      Tentei exaustivamente alterar o valor de padding e margin dos elementos, mas tudo em vão.
       
      Existe alguma solução para isto? Se for preciso posso postar o código feito até então..
       
      Obrigado desde já!
       
      FIG. 1

       
      FIG. 2

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.