Faça a imagem ir atrás do texto e mantenha-o no centro usando css

Question

Jul 07, 2009, 08:22 PM

Faça a imagem ir atrás do texto e mantenha-o no centro usando css

Estou criando uma página da web, onde eu tenho uma imagem, que eu quero colocar no centro e, em seguida, no topo da imagem que eu quero ter caixas de entrada e etiquetas e botão de envio.

Eu estou tentando usar o css

img.center
{
    z-index:-1;
}

mas isso não funciona. e quando eu mudar o código para

img.center
{
    position:absolute;
    left:0px;
    top:0px;
    z-index:-1;
}

se fizer a imagem ir para trás, mas então como eu useileft:0px etop:0px ... coloca a imagem no loaction 0,0 .. mas quero que a imagem fique no centro.

para manter a imagem no centro eu tenho<div align="center"> tag.

existe de qualquer maneira, eu posso manter a imagem no centro e fazê-la ir para trás também ???

Minha página .html se parece com isso: (eu tentei ter uma imagem de plano de fundo para minha tag div, mas nenhuma imagem está aparecendo por lá)

<html>
<head>
<title>Question of the Week</title>
<style type="text/css">
    body
    {
        background-image:url('images/background.jpg');
        background-repeat:repeat-x;
    }

    .container
    {
    background-image:url('images/center.jpg');
    background-repeat:no-repeat;
    }
    td.cntr {padding-top:50px;}
</style>
</head>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">

    <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td><div align="left"><img src="images/logo.jpg"></div></td>
                    <td></td>
                    <td><div align="right"><img src="images/right_logo.jpg"></div></td></tr>
            </table>
        </tr>
        <tr>
            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td class="cntr">
                        <div id="container">
                            <input name="box" type="textbox" />
                            <input name="box" type="textbox" />
                            <input name="submit" type="submit" />
                        </div>
                    </td>
                </tr>
            </table>
        </tr>
    </table>
</body>
</html>