0

Esta minha div não fica no meio da tela, esta errado o estilo CSS ?

<div style="position:absolute;margin:auto;">
    <img src="assets/img/PHP.png"/>
</div>
7
  • Tente usar <center><div> <img src="assets/img/PHP.png"/> </div></center> Commented 1/08/2017 às 19:05
  • Tente dar um tamanho a div (width) e colocar margin 0 auto.
    – HBretone
    Commented 1/08/2017 às 19:06
  • Assim <center><div> <img src="assets/img/PHP.png"/> </div></center>
    – PauloMaia
    Commented 1/08/2017 às 19:09
  • Certo, porem preciso que ela fique acima do meu rodapé , e longe de botton 50px
    – PauloMaia
    Commented 1/08/2017 às 19:10
  • No meio na vertical, na horizontal, ou as duas coisas?
    – bfavaretto
    Commented 1/08/2017 às 19:10

1 Resposta 1

3

.div{
   width: 200px;
   height: 100px;
   background: black;
   margin: 0 auto;
}
<div class="div">
   <img src="test.jpg">
</div>

Segue um exemplo..

Depois de ler os comentarios a cima, segue a edição

.div{
  width: 100px;
  height: 100px;
  background: black;
  position: absolute;
  left: 50%;
  margin-left: -50px;
}
<div class="div">
    
  </div>

Exemplo atualizado

.div{
      width: 100px;
      height: 100px;
      position: absolute;
      left: 50%;
      margin-left: -50px;
      bottom: 30px;
      z-index: 99999999
    }
    
footer{
      width: 100%;
      height: 50px;
      background: black;
      margin-top: 200px;
      bottom: 0;
      position: absolute;
}
<div class="div">
  <img src="https://forum.imasters.com.br/uploads/monthly_2017_02/mascote.png">
</div>

<footer>

</footer>

19
  • Para a imagem ficar centralizada na tela horizontalmente e acima na parte inferior 50px ?
    – PauloMaia
    Commented 1/08/2017 às 19:14
  • Assim ela esta ficando acima teria que ser 50px da parte debaixo da tela
    – PauloMaia
    Commented 1/08/2017 às 19:15
  • @PauloMaia Não entendi, você quer, centralizar a imagem e deixa-la na parte inferior com 50px de distancia do bottom? Commented 1/08/2017 às 19:16
  • @PauloMaia voce consegue colocar uma imagem de exemplo, para ficar mais facil o entendimento? Commented 1/08/2017 às 19:16
  • Sim isso mesmo, a imagem precisa ficar na parte inferior da minha pagina ( em modo flutuante ) para ficar acima do meu rodapé existente e 50px descolada da parte inferior
    – PauloMaia
    Commented 1/08/2017 às 19:17

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .