0

DuvidaEstou usando Bootstrap versão 3, e gostaria de sugestões como poderia customizar este glyph, eu tentei diversas formas de alinhar este ao texto, porém ele insiste em ficar um pouco acima da linha do texto.

Estou usando um Jumbotron com um Alert, e gostaria de anexar este glyphicon à mensagem. Porém usando as classes prédefinidas do Bootstrap, este ícone perde alinhamento, como poderia manipular o css para resolver?

O link para a documentação do bootstrap: https://getbootstrap.com/docs/3.3/components/#alerts

6
  • Não entendi qual o seu problema e qual a relação dele com programação. Poderia ser mais específico? Commented 26/09/2017 às 19:04
  • Perdão, eu preciso manipular o css para alinhar o glyphicon porque está desalinhado com o texto, gostaria de auxílio no desenvolvimento CSS para conseguir alinhá-lo. Neste fórum eu só posso postar JS e PHP? Commented 26/09/2017 às 19:13
  • claro que você pode postar CSS, alinhamento, estilo, UX etc. Só que precisa deixar claro qual foi sua dificuldade e as suas tentativas. Por exemplo, não tem nenhum código na pergunta, nem HTML, nem JS, nem PHP, nem CSS. Só tem uma imagem, que pelo que entendi indica a situação atual do seu código e o descontentamento com o resultado Commented 26/09/2017 às 19:23
  • A minha edição na sua pergunta foi uma tentativa de formatar a dúvida de modo que fique mais atrativa para o próximo leitor. Também removi detalhes irrelevantes (como saudações e a frase "preciso de ajuda"), tornando-a mais limpa. Entenda essa edição como uma sugestão, pode reverter o estado da pergunta se achar que eu exagerei ou que eu alterei o significado da pergunta Commented 26/09/2017 às 19:25
  • 1
    Entendi, obrigado pela atenção desde já.=) Eu não anexei as classes utilizadas pois são as classes do Bootstrap. Commented 26/09/2017 às 19:38

1 Resposta 1

0

Acho q o ideal é vc criar um css pra corrigir isso, pq acho que o boostrap em si não tem essa correção q vc procura.

Tente algo assim para seu CSS:

.vertical-align {
display: flex;
align-items: center;
flex-direction: row;
}

E depois utilize assim no seu código:

   <h2 class="alert alert-danger vertical-align" role="alert">
    <span class="glyphicon glyphicon-info-sign"></span> Informações Importantes:
  </h2>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .