Incluindo glyphicon-chevron-down

[Gilberto Jr 26]

Boa dia;

 

Eu criei uma lista de serviços no site do cliente;

 

O Código segue abaixo. O site é responsivo, uso o bootstrap. Veja que dentro de cada serviço, o sub serviço tem

<span class="glyphicon glyphicon-ok"></span>

.

			<div class="panel-group col-md-12" id="paineis-sobre">
				<div class="panel panel-default">
            		
					<div class="panel-heading" data-toggle="collapse" data-target="#primeiro-paragrafo" data-parent="#paineis-sobre">                    	
						<h1>Missão</h1>
					</div>

					<div class="collapse in" id="primeiro-paragrafo">
						<div class="panel-body text-left">
							<p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Levar soluções em TI de alto nível e qualidade com
                        profissionalismo e comprometimento.</p>
						</div>
					</div>
				</div>

				<div class="panel panel-default">
					<div class="panel-heading" data-toggle="collapse" data-target="#segundo-paragrafo" data-parent="#paineis-sobre">
						<h1>Visão</h1>
					</div>

					<div id="segundo-paragrafo" class="collapse">
						<div class="panel-body text-left">
							<p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Ser referência no segmento de TI, sendo reconhecida pelos
                        clientes, colaboradores e fornecedores, pelos serviços de
                        qualidade prestados.</p>
						</div>
					</div>
				</div>

				<div class="panel panel-default">
					<div class="panel-heading" data-toggle="collapse" data-target="#terceiro-paragrafo" data-parent="#paineis-sobre">
						<h1>Valores</h1>
					</div>

					<div id="terceiro-paragrafo" class="collapse">
						<div class="panel-body text-left">
                        <p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Busca permanente por oportunidade de melhorias, novas
                        técnicas, metodologias e avanços nas soluções executadas;</p>
                        <p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Comprometimento com o meio ambiente;</p>
                        <p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Responsabilidade;</p>
                        <p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Alta Performance;</p>
                        <p class="text-justify"><span class="glyphicon glyphicon-ok"></span> Revolução Humana;</p>
						</div>
					</div>
				</div>
			</div>

 

 

E eu quero colocar um

<span class="glyphicon glyphicon-chevron-down"></span>

na div

<div class="panel-heading"

. Só que quando eu coloco, o icone do span 

glyphicon glyphicon-chevron-down fica ao lado do texto do H1.

 

Eu quero que ele fique do lado esquerdo, ou seja.. no inicio. Da forma que esta a imagem. E também que fique mais ou menos do mesmo tamanho.

Linka da Imagem

 

Att;

Gilberto Jr

[Maujor 144]

Use a seguinte marcação HTML:

<h1>
  <span class="glyphicon glyphicon-chevron-down" style="vertical-align:bottom"></span>
  Missão
</h1>

Veja o resultado neste JSFiddle

 

 

Nota: O link que você postou para a imagem está quebrado.

[Gilberto Jr 26]

5 horas atrás, Maujor disse:

Use a seguinte marcação HTML:

<h1>
  <span class="glyphicon glyphicon-chevron-down" style="vertical-align:bottom"></span>
  Missão
</h1>

Veja o resultado neste JSFiddle

 

 

Nota: O link que você postou para a imagem está quebrado.

 

 

@Maujor, boa tarde.

 

Obrigado pelo retorno. funcionou perfeito. Mas um detalhe, o texto e o simbolo GLYPHICON-CHEVRON-DOWN fica centralizado. Eu gostaria de deixar somente o texto centralizado e o GLYPHICON-CHEVRON-DOWN do lado esquerdo.

 

E outra coisa, quando clicar na pra abrir, a setinha fica sentido apontando para baixo, quando clicasse e fosse pra fechar é possivel colocar GLYPHICON-CHEVRON-UP?

 

Obrigado!!!

 

Att;

Gilberto Jr

[Gilberto Jr 26]

Acertei a  marcação HTML e deu certo

<h1 class="text-center">Visão<span class="glyphicon glyphicon-chevron-down" style="vertical-align:bottom;float:right;"></span></h1>
        </div>

 

Obrigado pela força.

 

 

Att;
Gilberto Jr