Home/ Questions/Q 7067367
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T05:11:37+00:00

see this link…: Exemple on this site i have this code <body> <div id=geral>

  • 0

see this link…: Exemple

on this site i have this code

    <body>
    <div id="geral">
        <div id="animacao">
            <ul id="banners"> 
                <li><img src="banners/banner_1.jpg" alt="Banner 1" /></li>
                <li><img src="banners/banner_2.jpg" alt="Banner 2" /></li>
            </ul>
        </div>
        <div id="menu">

        </div>              
    </div>
</body>

#geral is positioned in the center of the screen –

#animacao has the same size of #geral, on this has animated images with fade effects..

#menu has 271px with and need to stay over and on center of #geral and #animacao, on this i will put the menu with PNG bakcground….

This is my CSS, and probably doesn’t work …

#geral{
    position: absolute;
    width:990px;
    height:530px;
    top:50%;
    left:50%;
    margin-top:-265px;
    margin-left:-495px;
    background: url(../imagens/fundo.jpg) no-repeat;
}

#animacao{
    position: relative;
    width:990px;
    height:530px;
}

#menu
{
    position: absolute;
    left: 50%;
    width:271px;
    height:530px;
    margin-left:-135px;
    background-color:yellow;
    z-index: 10;
}

Where am I wrong?

Demo

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Is this what you’re trying to do? http://jsfiddle.net/brettdewoody/C4jSS/

    Or did you want the #menu div positioned on top of #animacao?

    html

    <div id="geral">
    <div id="animacao">
        <div id="menu">

        <div>
    </div>       
</div>

    css

    #geral{
    position: absolute;
    width:990px;
    height:530px;
    top:50%;
    left:50%;
    margin-top:-265px;
    margin-left:-495px;
    background-color: black;
}

#animacao{
    position: relative;
    width:990px;
    height:530px;
    background-color: red;
}

#menu{
    position: relative;
    margin:0 auto;
    width:271px;
    height:530px;
    background-color:yellow;
    z-index: 10;
}
    • 0