Estou desenvolvendo com Meteor - Angular2 usando Angular 2 "s Flex Layout
Quero um resultado responsivo quando o tamanho da tela for menor que 520 px.
Funciona bem apenas redimensionando minha tela, mas usando um dispositivo real ou a barra de ferramentas do dispositivo Chrome É uma droga
Aqui está minha captura de tela de resultado e códigos
import { Component } from "@angular/core";
@Component({
selector: "demo-responsive-layout-direction",
template: `
<div class="containerX">
<div fxLayout="row" fxLayout.xs="column" fxLayout.sm="column" fxFlex class="coloredContainerX box" >
<div fxFlex> I"m above on mobile, and to the left on larger devices. </div>
<div fxFlex> I"m below on mobile, and to the right on larger devices. </div>
</div>
</div>
`
})
export class DemoResponsiveLayoutDirection { }
Imagens de resultado
Trabalho com redimensionamento de tela
Respostas:
0 para resposta № 1Eu resolvi esse problema sozinho !!
Você deve adicionar esta meta tag ao seu main.html (ou index.html) para detectar o dispositivo móvel corretamente (não apenas o tamanho da tela)
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Your Site Title</title>
</head>