Limitações do editor

O editor na interface habilitada para toque usa sobreposições para interagir com conteúdo confinado em um iframe. Essa interação cria algumas limitações no uso do editor e também para desenvolvedores. Esta página resume essas limitações e fornece soluções ou soluções alternativas, sempre que possível.

Limitações funcionais

Um autor pode encontrar as seguintes limitações funcionais ao usar o editor para criar páginas.

Quando editar uma página, os links não estão ativos.

  • Alterne para ​​ Visualizar modo de navegação para navegar usando os links no conteúdo.

Páginas de estrutura

As páginas não podem ser nomeadas como structure. As páginas nomeadas como structure não poderão ser editadas no editor de páginas.

Limitações de CSS

Um desenvolvedor pode encontrar as seguintes limitações com as interações do editor com o CSS.

Elementos absolutamente posicionados

Elementos com posição absoluta podem causar problemas na posição de sua sobreposição.

  • Se isso acontecer, verifique se as dimensões do elemento absolutamente posicionado estão corretas, pois o editor criará uma sobreposição com as mesmas dimensões.

unidades Vh

vh não há suporte para unidades, pois a altura do iframe deve ser automaticamente ajustada por AEM.

Imagens em segundo plano fixas

Imagens de plano de fundo fixas podem não ser exibidas como fixas na rolagem devido ao fato de estarem incorporadas em um iframe.

  • Selecionar Página de Visualização como Publicada nas ações da barra de cabeçalho exibe a página corretamente.

Altura 100%

A altura de 100% não é suportada no elemento de corpo de uma página.

  • Uma solução alternativa é possível para implementar um corpo de tela cheia "alongando" o elemento do corpo da seguinte forma:
body {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

Redução da margem

Problemas de redução da margem podem ser vistos se o primeiro elemento filho do elemento body tiver uma margem.

  • A solução é adicionar uma correção no nível do elemento do corpo, como a seguir:
body:before, body:after{
    content: ' ';
    display: table;
}

Nesta página