Duplicar posibles:
Trying to get tables next to each other horizontalHTML - dos mesas al lado del otro
Tengo dos tablas html ya creado. ¿Cómo puedo colocarlos uno al lado del otro en lugar de uno encima del otro?
Duplicar posibles:
Trying to get tables next to each other horizontalHTML - dos mesas al lado del otro
Tengo dos tablas html ya creado. ¿Cómo puedo colocarlos uno al lado del otro en lugar de uno encima del otro?
Dependiendo de su contenido y espacio, puede usar flotadores o visualización en línea:
<table style="display: inline-block;">
<table style="float: left;">
Échale un vistazo aquí: http://jsfiddle.net/SM769/
Documentación
display
el MDN - https://developer.mozilla.org/en/CSS:displayfloat
el MDN - https://developer.mozilla.org/en/CSS/floatNo creo que configurar la ['visualización'] (https://developer.mozilla.org/en-US/docs/Web/CSS/display) en el bloque en línea sea la respuesta aceptada, ya que un '
'Elemento debe tener explícitamente el atributo mostrar' establecido en 'tabla'. De lo contrario, no se comporta exactamente como una tabla. – WoIIeCon CSS: table {float:left;}
?
Usted puede colocar sus mesas en un div y añadir estilo a su mesa "float: left"
<div>
<table style="float: left">
<tr>
<td>..</td>
</tr>
</table>
<table style="float: left">
<tr>
<td>..</td>
</tr>
</table>
</div>
o simplemente utilizar css:
div>table {
float: left
}
Como mencioné en la respuesta de themhz, los divs de envoltura no son necesarios. En general, uno trata de lograr la presentación deseada utilizando el menor número de etiquetas posible. –
sí sin div también float left works –
<div style="float: left">
<table>
<tr>
<td>..</td>
</tr>
</table>
</div>
<div style="float: left">
<table>
<tr>
<td>..</td>
</tr>
</table>
</div>
No se requieren los divs de embalaje; puede flotar las tablas por sí mismo. Agregar los divs solo agrega más marcado, innecesariamente. –
puede estilo con CSS: http://en.wikipedia.org/wiki/Cascading_Style_Sheets – David
Hola Matt, ¡Bienvenido a Stack Overflow! ¿Puedes proporcionar una muestra de tu código existente? Eso nos ayudará a descubrir qué es lo que busca y facilitarle la respuesta a su pregunta. Además, asegúrese de consultar http://stackoverflow.com/questions/how-to-ask –