Boas pessoal!
Estou a desenvolver um site responsivo em ASP.NET que apresenta uma imagem com uma tabela ao lado.
A minha intenção é que se a tela diminuir, a tabela passe para "baixo" do ecrã.
Já o consegui, mas ainda não da forma desejada.
Passo a exemplificar.
Esta é a pagina em landscape:
Quando reduzo a largura da página acontece-me isto:
De facto eu quero que a tabela passe para baixo quando o tamanho da página é menor, mas gostaria que a imagem reduzi-se de tamanho (com a redução de tela), a fim da tabela caber ao lado, até a imagem ter X pixeis.
Compreendem?
CSS:
ASP:
Antes de mais, muito obrigado!
Estou a desenvolver um site responsivo em ASP.NET que apresenta uma imagem com uma tabela ao lado.
A minha intenção é que se a tela diminuir, a tabela passe para "baixo" do ecrã.
Já o consegui, mas ainda não da forma desejada.
Passo a exemplificar.
Esta é a pagina em landscape:
Quando reduzo a largura da página acontece-me isto:
De facto eu quero que a tabela passe para baixo quando o tamanho da página é menor, mas gostaria que a imagem reduzi-se de tamanho (com a redução de tela), a fim da tabela caber ao lado, até a imagem ter X pixeis.
Compreendem?
CSS:
Código:
.wrapper {
overflow: hidden;
}
.wrapper div {
display:table;
height: 100%;
}
.itemwrapper {
background-color: gray;
float: left;
margin-right: 40px;
}
.quadro {
overflow: hidden;
margin-top:180px;
min-height: 130px;
}
@media screen and (max-width: 700px) {
.itemwrapper {
float: none;
margin-right: 0;
margin-left: 30px;
margin-top: 40px;
width: auto;
border: 0;
border-bottom: 2px solid #000;
}
}
ASP:
Código:
<div class="wrapper">
<div class="itemwrapper "><img src="Content/logo.jpg" class="img-responsive" />
</div>
<div class="quadro"></div>
</div>
Antes de mais, muito obrigado!
Última edição: