[Resolvido] Só permitir expandir texto verticalmente para cima

[TeixeiraRamos 4]

Salve!

Não estou conseguindo fazer com que a minha div ao entrar um texto (letras) só se expanda para cima.

Essa funcionalidade vai permitir a criação de gráfico dinâmico.

O meu exemplo está Clique aqui observe que a medida que o bando de dados manda registros (letras) as barras descem e deveriam subir.

Uma das colunas está assim como pode ser constatado:

 

#div-coluna-vale-dez{ 	background: #666666; 	width:2em; 	text-transform:uppercase; 	left: 5px; 	color: #666666; 	top: 215px; 	position: absolute; 	border-top: thin solid #000000; 	border-right: thin solid #000000; 	border-bottom: thin solid #000000; 	border-left: thin solid #000000; 	margin-bottom: 40px; }

 

 

Obrigado

[William Bruno 1501]

cara... uma forma q pensei de fazer esse posicionamento, é trabalhar com position: absolute; usando bottom: 0;

 

assim qualquer acréscimo de altura, seria 'para cima'.

[TeixeiraRamos 4]

Procedi conforme sua orientação mas agora inverteu as posições, ou seja, as barras ficam todas na parte superior. Elas tem que iniciar na parte de baixo e a medida que forem recebendo os registros (letras) elas sobem. A idéia é ficar como uma barra de um gráfico.

Deve ser possível.

Por favor verifique Clique aqui

Ficou assim:

 

#div-coluna-vale-dez{
background: #666666 bottom;
width:2em;
text-transform:uppercase;
left: 5px;
color: #666666;
top: 0px;
position: absolute;
border-top: thin solid #000000;
border-right: thin solid #000000;
border-bottom: thin solid #000000;
border-left: thin solid #000000;
vertical-align: bottom;
clip: rect(auto,auto,auto,auto);
}

#div-coluna-vale-vinte{
background: #666666 bottom;
width:2em;
text-transform:uppercase;
left: 50px;
color: #666666;
top: 0px;
position: absolute;
border-top: thin solid #000000;
border-right: thin solid #000000;
border-bottom: thin solid #000000;
border-left: thin solid #000000;
vertical-align: baseline;
padding-bottom: 0px;
}

[João Prado 64]

Você utilizou top:0; quando deveria ser bottom:0;

[TeixeiraRamos 4]

OK, Funcionou!

Vou retornar com a CSS completa.

Agora através do Access mesmo crio uma consulta e gero um gráfico dinamico.

Tão logo esteja pronto eu posto para aqueles que desejarem.

Muito obrigado a todos.

Feliz Natal e um Ano Novo com muita Saúde, Alegria e Paz.