Alinhamento em tabelas

[Carcleo 4]

Pessoal,

estou com um problema em alinhamento.

 

tenho a pagina abaixo apenas com este conteudo:

<table style="text-align:center;width:400px">
 <tr>
   <td style="text-align:center;vertical-align:middle;height:400px"><h1>Ambiente Administrativo</h1></td>
 </tr>
</table>

Nem ff nem chome nem ie alinha esta tabela e coluna ao centro nem a coluna a centro verticalmente.

Tentei fazer assim:

<table width="400px" align="center">
 <tr>
   <td align="center" valign="middle" height="400px"><h1>Ambiente Administrativo</h1></td>
 </tr>
</table>

Apenas o ie fez os alinhamentos.

E tentei assim por ultimo:

<h1 style="text-align:center;vertical-align:middle;width:400px;height:300px">Ambiente Administrativo</h1>

O que pode ser feito?

[willwalker 2]

Simplesmente use o line-height, exemplo:

 

<style type="text/css">
.td { height: 400px; line-height: 400px; }
</style>

 

 

Abraços

[Carcleo 4]

nada amigo.

 

Tavez uma forma de trabalhar apenas com o h1 e eliminar a tabela.

 

Mas, como fazer um h1 com 400px largura e 300px altura texto centralizado horizotal e ao middle?

[willwalker 2]

Assim:

 

h1 { display: block; height: 400px; line-height: 400px; text-align: center; }

 

Abraços

[Carcleo 4]

tambem não funcionou.

O jeito foi criar um h1 do tamanho do body e alinhar o texto dele ao centro.

 

Porem, só consigo alinhar horizotalmente. Se eu colocar o h1 com 400px, não consigo levar o h1 pro meoi da tela

Alinhar verticalmente não funciona.

 

Veja como fiz:

<h1 style="
            text-align:center;
            width:1000px;
            height:400px; 
            line-height:400px;
          ">
   Ambiente Administrativo          
</h1>           

O que estará faltando?

O unico detalhe que não funciona ai é o:

 

 

vertical-align:middle;

[Marrabel 20]

Fica esquisito você colocar uma "h1" dentro de uma tabela.

 

Use o "th" para titulos de tabelas

 

<table width="400" border="0" cellspacing="0" cellpadding="0">
 <tr>
<th align="center" valign="middle">Ambiente Administrativo</th>
 </tr>
 <tr>
 	<td align="center" valign="middle">Minhas colunas</td>
 </tr>
</table>

 

No CSS voce pode ou definir uma formatação para a tag "TH" ou colocar um id ou classe...

[André do Vale 76]

Alinhamento vertical em celulas de tabelas funciona normalmente. Talvez tenha algum outro ponto do código que sobrescreva esse "center" que você deseja. Revise seu CSS, ou então declare !important.

 

Sugestão de código HTML para tabela:

 

<table>
 <thead>
   <tr>
     <th>
 <tfoot>
   <tr>
     <th>
 <tbody>
   <tr>
     <td>
   <tr>
     <td>
</table>

 

:thumbsup:

[Carcleo 4]

Título de tabelas é o <caption> que eu uso.

 

Há sim, titulo dad colunas das tabelas.

 

Ai sdim é o <th>. Ta certo.

 

Mas ja eliminei as tabelas.

Agora, quero alinhar o h1 ao centro do body.

 

Será que terei que usar left=50% e margim left= metade da largura?

 

Assim terei que coloar seu position como abasolute e ai complica.

 

Fica esquisito você colocar uma "h1" dentro de uma tabela.

 

Use o "th" para titulos de tabelas

 

<table width="400" border="0" cellspacing="0" cellpadding="0">
 <tr>
<th align="center" valign="middle">Ambiente Administrativo</th>
 </tr>
 <tr>
 	<td align="center" valign="middle">Minhas colunas</td>
 </tr>
</table>

 

No CSS voce pode ou definir uma formatação para a tag "TH" ou colocar um id ou classe...

[Marrabel 20]

Mas se você for utilizar dados tabulares, porque não quer usar tabelas? É pra isso que ela serve, e somente isso.

 

Deixe um exemplo de como você quer mostrar seus dados. Assim facilita pra gente te ajudar...

[Carcleo 4]

Não, não.

 

Deixa eu explicar.

Essa aí é a primeira página do ambiente administrativo do site.

Ela só tem esse h1 mesmo.

 

Mas, quando tem dados do banco eu uso sim tabelas. Mas, como você disse, é só pra isso mesmo que estou usando tabelas agora.

 

Mas, ainda não consegui alinhar verticalmente o h1 no body. O texto no h1 ta alinhado. O que n~çao consigo é alinhar o h1 no body.

[André do Vale 76]

Precisa ser exato, ou só efeito visual?

 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>H1 Vertical-Align</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
html,body {
height: 100%;
}
h1 {
text-align: center;
padding: 24% 0 0 0;
}
</style>
</head>

<body>
<h1>Lorem ipsum dolor</h1>
</body>
</html>