Question

So I have a div table set up with this CSS, as below, so that it is centered and fixed at the top of the page. I can set up another div and center it but I am having trouble getting the DIV to be below the top one. Any advice?

This is the css for the top DIV:

.fixedtop
{
    position: fixed;
    top: 0px;
    left: 50%;
    margin: 0 0 0 -400px;
    background-image: url(bannerlogo.jpg);
    width:800px;
    height: 414;
}

This is the most recent css that I have tested:

.fixedcenter
{
        position:center;
    margin-top: 414px;
    width:800px;
    height: 414px;
}

I’ve also tried to use padding and messing with margins for centering. All help is very much appreciated.

Answer 1

Try this:

.fixedtop
{
    margin-left: auto;  
    margin-right: auto; 
    border: 1px solid black; /* I only added the borders so that I could*/
                             /* see what was happening more easily.*/
    background-image: url(bannerlogo.jpg); 
    width: 800px; 
    height: 414px;
}

.fixedcenter
{
    border: 1px solid black; 
    margin-left: auto; 
    margin-right: auto; 
    width: 800px; 
    height: 414px;
}

It looks like this: