1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

DIV fixa

Discussão em 'Web Development' iniciada por TiagoNolasco, 8 de Abril de 2009. (Respostas: 13; Visualizações: 1454)

  1. Boas

    Alguém sabe como alinhar uma div fixa ao centro com css?
    Não é o texto da div, mas sim a div propriamente dita.

    Cumprimentos
    Tiago Nolasco
     
  2. tonebiclas

    tonebiclas Power Member

    magin: 0 auto

    ou

    margin: auto 0

    é uma dessas...põe um background para veres se faz efeito

    cumps ;)
     
  3. Não funciona..a div continua alinhada a esquerda. Este é o codigo que estou a usar.

    div#fix { position:fixed; bottom:0; }
    div.pos {
    width:850px;
    height:30px;
    text-align:center;
    font-size: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background:#684f73;
    color:#FFFFFF;
    }

    Cumps
     
  4. tonebiclas

    tonebiclas Power Member

    qual das div's queres alinhar ao centro ?

    #fix ou .pos ?
     

  5. #fix
     
  6. tonebiclas

    tonebiclas Power Member

    tem de dar...tira tudo e mete só marin: 0 auto e um background
     
  7. Nada...continua alinhado a esquerda..
     
  8. Morphine0225

    Morphine0225 Power Member

    Envia o código por completo para poder ver, tanto do CSS como do html.


    Cumps
     

  9. <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <style>


    div#fix { position:fixed; bottom:0; }

    div.pos {
    width:500px;
    height:30px;
    text-align:center;
    font-size: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background:#684f73;
    color:#FFFFFF;
    }

    </style>
    </head>

    <body>

    <div id="fix" class="pos">Ola Mundo!</div>

    </body>
    </html>

    O que eu quero é que essa "barra roxa" (div) fique alinhada ao centro.

    Cumps
     
  10. Morphine0225

    Morphine0225 Power Member

    Código:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Página</title>
    <style>
    
    
    #fix {
        width:500px;
        height:30px;
        position:absolute;
        top:50%;
        left:50%;
        margin-left:-250px;
        margin-top:-15px;
    }
    
    .pos {
        text-align:center;
        font-size: 10px;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        background:#684f73;
        color:#FFFFFF;
    }
    
    </style>
    </head>
    
    <body>
    
    <div id="fix" class="pos">Ola Mundo!</div>
    
    </body>
    </html>
    Experimenta assim. Tens de ter atenção que o CSS não consegue detectar o centro da div, ou seja, cada vez que mudares o tamanho da div, no CSS vais ter de fazer os "-[metade do tamanho]" para assim centrares isso.

    Se precisares de mais alguma coisa apita!
     
  11. Bem..está a funcionar..

    muito obrigado

    Cumps
     
  12. Morphine0225

    Morphine0225 Power Member

    De nada! Se quiseres mudar a DIV de tamanho e tiveres dificuldade faz um post nesta mesma thread! ;)

    Cumps!!
     
  13. Obrigado mais uma vez.. Ja estive a esperimentar e ja descobri como fazer quando mudo o tamanho. basta subtrair as metades como disseste.

    ;)

    cumps
     

Partilhar esta Página