Solucionado
Olá pessoal tudo bem? tenho uma dúvida.
Segui o exemplo certinho da vídeo aula absolute mais a fundo, e o resultado esperado era esse:
Porém deu ruim em alguma coisa aqui e a caixinha não fica bem posicionada a direita como gostaria e está assim:
Já tentei inspecionar o elemento e ver o que tá dando esse espaçamento mais está um mistério hehehe
Segue abaixo um link com o index.html e index.css pra vocês darem uma olhada, se conseguirem hehehe
Olá, Marcos! Tudo bem? =)
Eu dei uma olhada aqui no seu código e rodei... Aqui apareceu normalmente, conforme a primeira figura, mas acho que sei o que está acontecendo.
Repara que no seu código, o HTML responsável por aquela caixinha é o seguinte:
<p class="inicio-post">Design responsivo tem ganho cada vez mais atenção como técnica de desenvolvimento de páginas web para dispositivos móveis. Mas como começar?</p>Esse elemento possui a classe inicio-post:
.inicio-post {
background-color: #FFF;
position: absolute;
top: 3em;
right: 3em;
height: 6em;
padding: 1em;
}Agora vamos ao que interessa... Esse parágrafo está com posicionamento absoluto e a posição dele é top: 3em e right: 3em, ou seja, ele deve estar distante 3em do topo e da direita da página. O que é verdade em ambos os casos!
O problema é o tamanho desse parágrafo, ou seja, o quanto ele irá ocupar na página. No meu caso, estou usando um monitor com 1920 x 1080px. Dá uma olhadinha na resolução do seu monitor, pois acredito que o problema seja isso...
Depois teste se o problema realmente é esse colocando alguns valores de width para essa classe! Chutando bem feio, coloque assim:
.inicio-post {
// Aqui estão TODAS as propriedades anteriores.
width: 50%;
}Espero ter ajudado, mas se ainda estiver com dúvida, posta aqui para podermos ajudar!
Abraço e bons estudos,
Fábio
Olá Fábio tudo bem?
Muito obrigado pela ajuda, o problema realmente era a resolução do monitor do meu Notebook que é 1366x768.
Colocando o a propriedade width: 50%; resolveu meu problema, apesar de quebrar o texto dentro da caixinha (não tem jeito por conta da frase ser longa.
Mas uma vez obrigado pela ajuda e um abraço!