[RESOLVIDO]CSS: Colocar duas tabelas lado a lado sem o uso de uma tabela pai

This message was edited 3 times. Last update was at 04/06/2008 00:50:07

Olá pessoal.
Preciso exibir duas tabelas no IE 7, uma do lado da outra, porém sem usar uma tabela pai. Pra facilitar, vai aí um código exemplo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>Tests</title>
	</head>
<body>
	<table width="500px" border="1">
		<tr>
			<td width="90%">
				<div id="inliner" style="width: 100%; background-color: #dddddd">
					<div style="position:static; display: inline; border: solid #000000 1px; background-color: #aaaaaa;">
						<table id="leftTable" style="margin-left: 15px;">
							<tr>
								<td>
									<span>
										<img src="bullet.jpg" />
										<span>Esquerda</span>
									</span>
								</td>
							</tr>
							<tr>
								<td>
									<input type="text" size="18">
								</td>
							</tr>
						</table>
					</div>
					<div style="position:static; display: inline; border: solid #000000 1px; background-color: #aaaaaa;">
						<table id="rightTable" style="margin-left: 15px;">
							<tr>
								<td>
									<span>
										<img src="bullet.jpg" />
										<span>Direita</span>
									</span>
								</td>
							</tr>
							<tr>
								<td>
									<input type="text" size="18">
								</td>
							</tr>
						</table>
					</div>
				</div>
			</td>
			<td>
				<input type="submit" value="OK">
			</td>
		</tr>
	</table>
</body>
</html>

Não devo mexer muito na estrutura desse código. Tentei utilizar a propriedade display com o valor inline nas tabelas leftTable e rightTable, porém, o resultado que obtive foi uma coisa nada a ver (vide anexo "!1wrong.bmp"). Eu queria algo como o anexo "!2desired.bmp", mas não consigo...
O interessante é que se o conteúdo das divs que estão com "display: inline" for apenas um texto simples, aí fica certinho...
Será que não tem jeito mesmo?

GUJ Master Membro desde: 16/12/2004 17:09:19 Mensagens: 1787 Offline

Coloca um "float: left;" no style dos divs...

This message was edited 1 time. Last update was at 03/06/2008 23:10:39

Pra colocar lado a lado vc usa:

--- EDITADO ---

foi mal renato vc acabou postando enquanto eu estava escrevendo a minha resposta

Muitíssimo obrigado pessoal! Ficou perfeito!

Notícias, artigos e o maior fórum brasileiro sobre Java