Question

I am having a problem with what i think is my style sheet. My site page seems to be set up fine:

However, when i view it in a browser the middle document is out of line:

Could there be anything causing this to happen? it leads me to think maybe something in my css file is? But what? 🙁

My css file is as follows:

    div.left
{
    float: left;
    width: 15%;
    background-color: white;
}

div.right
{
    float: right;
    width: 40%;
    background-color: white;
}

div.center
{
    float: left;
    width: auto;
    background-color: white;
    text-align:center;
}

Answer 1

That’s most probably due to your floating elements and since the center div is not floated at all, but rather “pushed” to the middle by the float:left of the left div.

If your div‘s in the html are like:

<div class="parent_div">
    <div class="left"> left </div>

    <div class="center"> center</div>

    <div class="right"> right</div>
</div>

Try floating the center div to the left also, and it should do the trick

div.center
{
    float: left;
    width: auto;
    background-color: white;
}