Colocar mesas lado a lado, se houver espaço suficiente na tela

StackOverflow https://stackoverflow.com/questions/402817

  •  03-07-2019
  •  | 
  •  

Pergunta

Eu tenho duas tabelas HTML que seria idealmente ser colocados lado a lado na tela. Widescreen monitores irão lidar com esta bem, mas as mesas são demasiado grandes para estar lado a lado na maioria dos monitores antiquados. Então eu quero usar css (ou mesmo apenas HTML, se possível) para colocar o lado do mesas a lado apenas se a resolução é alta o suficiente.

Isso funciona automaticamente com imagens, geralmente, mas há uma maneira de fazê-lo para tabelas?

Foi útil?

Solução

Sim, aplicar o flutuador estilo CSS: deixar para os elementos da tabela

Aqui está uma excelente cartilha sobre flutuante: http://css.maxdesign.com.au/floatutorial /

Outras dicas

Meu conselho seria para flutuar a mesa (lembre-se de especificar uma largura da tabela - escolher um que é cheia em um monitor non-widescreen). 

table {
    width: 500px; /* important */
    float: left;
}

No entanto, este pode funcionar também (não testado): 

table {
    display: inline;
}

tentar isso (você pode alterar o tamanho da janela): 

<html>
<body bgcolor="red">
<p>
    <table bgcolor="green" style="float: right;">
    <tr>
        <td>sssssssssssssssssssssssssssssssssssssssssss</td>
    </tr>
    </table>

    <table bgcolor="blue" style="float: left;">
    <tr>
        <td>eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee</td>
    </tr>
    </table>
</p>
</body>
</html>

->

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top