Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

o cara¬¬

como colocar tabelas uma do lado da outra?

Recommended Posts

gente, como posso colocar as tabelas uma do lado da outra, como a da imagem?

 

Imagem Postada

 

agradeço desde já...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara.. Primeiro pensa em quantas tabelas você vai colocar uma do lado da outra...

Antes de criá-las, faça uma tabela externa com uma única linha e com a quantidade de colunas = a quantidade de tabelas que você deseja colocar.

 

Feito isso você coloca uma tabela em cada uma das colunas criadas!!

Compartilhar este post


Link para o post
Compartilhar em outros sites

alguem pode me ajudar com o que ele citou acima? obrigado...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Oque o Ulisses José disse, foi o seguinte:

<table border="2">
<tr>
	<td>
	<table border="1" bgcolor="#ff000">
	<tr>
		<td>Linha 1, Coluna 1</td>
		<td>Linha 1, Coluna 2</td>
		<td>Linha 1, Coluna 3</td>
	</tr>
	<tr>
		<td>Linha 2, Coluna 1</td>
		<td>Linha 2, Coluna 2</td>
		<td>Linha 2, Coluna 3</td>
	</tr>
	</table>
	</td>
	<td>
	<table border="1" bgcolor="#0ff000">
	<tr>
		<td>Linha 1, Coluna 1</td>
		<td>Linha 1, Coluna 2</td>
	</tr>
	<tr>
		<td>Linha 2, Coluna 1</td>
		<td>Linha 2, Coluna 2</td>
	</tr>
	</table>
	</td>
	<td>
	<table border="1" bgcolor="#000ff0">
	<tr>
		<td>Linha 1, Coluna 1</td>
		<td>Linha 1, Coluna 2</td>
	</tr>
	<tr>
		<td>Linha 2, Coluna 1</td>
		<td>Linha 2, Coluna 2</td>
	</tr>
	</table>
	</td>
</tr>
<table>

Coloquei cada tabela em uma cor, para ficar mais fácil a visualização. Mas isso é errado em Webstandard, pois está usando uma Tabela para construir o layout, das outras...

Acredito que o mais correto seja algo assim:

<html>
<head>
<style>
.tabelaum{
	float: left;
	background-color: #ff0000;

}
.tabeladois{
	float: left;
	background-color: #0ff000;
}
.tabelatres{
	float: left;
	background-color: #0000ff;
}
</style>
</head>
<body>

	<table class="tabelaum" border="1">
	<tr>
		<td>Linha 1, Coluna 1</td>
		<td>Linha 1, Coluna 2</td>
		<td>Linha 1, Coluna 3</td>
	</tr>
	<tr>
		<td>Linha 2, Coluna 1</td>
		<td>Linha 2, Coluna 2</td>
		<td>Linha 2, Coluna 3</td>
	</tr>
	</table>

	<table class="tabeladois" border="1">
	<tr>
		<td>Linha 1, Coluna 1</td>
		<td>Linha 1, Coluna 2</td>
	</tr>
	<tr>
		<td>Linha 2, Coluna 1</td>
		<td>Linha 2, Coluna 2</td>
	</tr>
	</table>

	<table class="tabelatres" border="1">
	<tr>
		<td>Linha 1, Coluna 1</td>
		<td>Linha 1, Coluna 2</td>
	</tr>
	<tr>
		<td>Linha 2, Coluna 1</td>
		<td>Linha 2, Coluna 2</td>
	</tr>
	</table>
</div>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

opa...valw...vo testar...depois posto aki se der certo!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Fala ae "O Cara", beleza!!!

Seguinte, não sei se estou certo, mas parece q você está querendo fazer uma menu, certo?!

Se for, você pode usar uma lista <ul> e configurar ela via css!!! Pq se essa linha for dinâmica e o número de itens for variável, você só precisa configurar a <li> uma vez e pronto, elas serão iguais!!!!!

Mas se realmente tem q ser em tabela, o q o "tiu uiLL" disse é a saída!!!!! o uso do float!!!! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

 

[]'s

Compartilhar este post


Link para o post
Compartilhar em outros sites

Fala ae "O Cara", beleza!!!

Seguinte, não sei se estou certo, mas parece q você está querendo fazer uma menu, certo?!

Se for, você pode usar uma lista <ul> e configurar ela via css!!! Pq se essa linha for dinâmica e o número de itens for variável, você só precisa configurar a <li> uma vez e pronto, elas serão iguais!!!!!

Mas se realmente tem q ser em tabela, o q o "tiu uiLL" disse é a saída!!!!! o uso do float!!!! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

 

[]'s

exatamente...você poderia postar pra mim esse código? vlw^^

Compartilhar este post


Link para o post
Compartilhar em outros sites

poxa... poderia ter dito antes que prentendia fazer um menu...

#menu li{
 float: left;
}
<div id="menu">
<ul>
 <li>primeira opção</li>
 <li>segunda opção</li>
</ul> <!-- UL é lista não ordenada -->
</div>

pesquise antes de perguntar.. tem muitas coisas sobre menus aqui... e por ai, internet a fora..

Para aprender algo, pedir códigos prontos, é a pior escolha.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.