Como posso posicionar relativamente um elemento e não ocupar espaço no fluxo de documentos?
html
css
positioning
css-position
Web designer
fonte
fonte
Respostas:
O que você está tentando fazer parece um posicionamento absoluto. Por outro lado, você pode, no entanto, criar um elemento pseudo-relativo, criando um elemento relativamente posicionado com largura zero, altura zero, essencialmente apenas com a finalidade de criar um ponto de referência para a posição e um elemento absolutamente posicionado dentro disso:
fonte
Adicione uma margem igual aos pixels que você moveu:
Exemplo
fonte
left: -25px; margin-right: -25px;
e ainda compensa os elementos irmãos horizontalmente por 2-3 pixels por algum motivo.float:right;
quando você quiser fazer isso em relação ao lado direito da tela, para que os valores da direita ou da esquerda possam ser menores e mais gerenciáveis.top:
valores que você precisa termargin-bottom:
igual ao menos da altura do elemento não o deslocamentoAo ler um pouco, parece que você pode posicionar um elemento em absoluto, desde que o elemento pai esteja relativamente posicionado. Isso significa que se você tiver o CSS:
O elemento filho não ocupará nenhum espaço no fluxo do documento. Você pode posicioná-lo usando uma das propriedades "esquerda", "inferior", etc. O posicionamento relativo no pai geralmente não deve afetá-lo, porque ele será posicionado na sua posição original por padrão se você não especificar "left", "bottom" etc.
http://css-tricks.com/absolute-positioning-inside-relative-positioning/
fonte
Você simplesmente retira esse elemento do fluxo do documento, definindo
position: absolute
e deixando seu ponto de interrupção se mover livremente com o fluxo dinâmico do conteúdo, não especificando as propriedades de estiloleft top right
ebottom
que o forçarão a usar o ponto de extremidade relativo do fluxo dinamicamente. Dessa forma, o elemento absolutamente posicionado seguirá o fluxo do documento e evita que ocupe o espaço.Não são necessários invólucros fictícios.
fonte
Para mim, as soluções dadas não funcionaram bem. Eu quero ver um h3, que o texto e, depois disso, painéis de inicialização, sincronizados verticalmente com esses painéis, eu quero ver outros painéis no lado direito,
Eu consegui isso com uma altura: 0 wrapper e depois dessa posição: relativa; esquerda: 100%.
fonte
@Bekim Bacaj tinha a resposta perfeita para mim, mesmo que não seja exatamente o que o OP estava procurando (embora sua pergunta deixe espaço para interpretação). Dito isto, Bekim não forneceu um exemplo.
O exemplo acima configura um elemento que ...
top
configuração padrão )right: 0
)position: absolute
)fonte