• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

Knitter

Texto alinhado ao fundo?

9 mensagens neste tópico

Ando aqui às voltas com o alinhamento de texto, como raio é que faço para colocar o texto alinhado ao fundo de uma div?

Tenho uma div para a qual desenho a margem de baixo, queria que o texto, que está dentro de uma tag h1, se alinhasse ao fundo da div para dar ideia que está em cima da linha e não ficar um espaço tão grande de diferença. Mas por mais tags que experimente o raio do texto não se mexe.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pelo que me lembro, e já não mexo em css à um tempo, não consegues, em css não existe o alinhamento vertical com nas tabelas.

Acho que a maneira mais facil é utilizares o padding. Não sei se estou a visualizar bem a cena, mas deve dar se fores aumentando o padding do topo, e/ou diminuindo o do fundo

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

#div {

vertical-align: botom;

}

Deve dar....experimenta

Cumps.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Para fazer isso tens de ter duas divs e defines a propriedade na div interior

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Para fazer isso tens de ter duas divs e defines a propriedade na div interior

Exacto, e na inferior metes style="vertical-align:bottom" :P
0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Para fazer isso tens de ter duas divs e defines a propriedade na div interior

Exacto, e na inferior metes style="vertical-align:bottom" :)

o 'vertical-align' é só para elementos inline, tipo imagens ou spans, por isso neste caso não funciona.

Para fazeres isto podes usar o position:absolute

Experimenta este código, adapta para ti depois.

<?xml version="1.0" encoding="windows-1252"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<!-- Created on: 07-02-2007 -->

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />

<title>megaware - Soluções de Informática</title>

<style>

<style type="text/css">

div.a{}

div.b

{

position:relative;

height:200px;

background-color:cyan;

}

div.c

{

position:absolute;

bottom:0px;

left:0px;

background-color:yellow;

}

</style>

</style>

</head>

<body>

<div class="b">

Este texto fica no topo do div...

<div class="c">

Vê lá se este fica onde queres...

</div>

</div>

</body>

</html>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

<style type="text/css">
div.center {
    text-align: center;
}
</style>

<div class="center">
    texto
</div>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora