Div Centering CSS

I am struggling with my website, I am trying to get the divs at the bottom to go in the center. The main text section centers and displays fine, its only the footer where the text

Solution 1:

Its hard to guess what exactly you are looking for.. i've aligned the links side by site and the #footerContainer is at the center -- you can check it if the window size is more than 960px.. well,enough said -- check the demo

DEMO

Solution 2:

Not sure about your HTML but I guess it may be because you use float:left in your footer related styles.

I think the main reason that you don't get text aligned in the center is the fact that using floating on containers (div) will make them have width equal to content, but not 100%.

So text-align (which only has effect on inline elements like links, spans, inputs) can't align the content in the center because it already takes the full size.

I guess the problem is here: using float:left with conjunction of text-align:

#footertext{
  float: left;
  text-align:center;
}

Solution 3:

See my CSS below with notes. I've included the bare minimum you need to get what I believe is your desired effect. (If you want both the #footertext and #footerlinks to be on the same line, just add display:inline to both ids.

#footer {
    width: 100%;
}

#footercontainer{ /* corrected spelling to match HTML id */
    width: 960px;
    margin: 0px auto; /* horizontally centers div */
}

#footertext{
    text-align: center; /* horizontally center text */
}

#footerlinks{
    text-align: center; /* horizontally center text */
}

#footerlinks ul {
    list-style: none; /* remove bullets from list */
}
#footerlinks ul li {
    display: inline; /* make li elements inline */
}