Image Slightly Off

[Obey]

As you can see from the image above, the bottom of the box is slightly off to the side and it kinda fucks up the whole thing. I've tried using float: left; in my css but it stays exactly the same. Here's the css:

#content-bottom {
        background: url('../img/content-bottom.png'); 
        width: 833px;
        height: 5px;
        float: left;

    }

My HTML is simply:

<div id="content-bottom"></div>

I'm really stuck on this one, I can't seem to figure it out.

 

[BIOS]

Are you referring to the width of the box?

 

[Obey]

Are you referring to the width of the box?

No, the width is perfectly fine, it's just off to the right a bit more than it should be.

 

[Swaggots]

margin-left: -10px;

As simple as that, I believe. Adjust the 10 to whatever value is good

 

[brsy]

You can either add a left margin of around -10px, or you can edit the image. I can almost guarantee it's because there is white space (or a gap) on the left side of the image.

 

[Obey]

You can either add a left margin of around -10px, or you can edit the image. I can almost guarantee it's because there is white space (or a gap) on the left side of the image.

I looked on photoshop and there isn't a gap. There's an image at the top that is the same as this so I just took it in photoshop and flipped it, still not working though.

 

[Sysode]

Check via the inspect element. It's the best way to identify whether there are any margins/paddings present that you are not aware of (or inherited via other elements). Inspector will identify it for you - play around with the code in browser then adjust accordingly.