Please help...simple question

HTML & CSS
1

Hello All,

Not really a web designer, but I’m trying to finish my portfolio site. All my divs are kept in this “container div”, which is have set to auto margin. It works properly in FF and Safari, but Chrome and IE won’t center the container div. Please help, I know there are other posts about similar problems, but none of those solutions seems to help me in the case…what am I doing wrong? Thanks.

The site:

2

It works properly in FF and Safari, but Chrome and IE won’t center the container div
Hi,
It’s not centering in FF or Safari either.

You have overridden your auto margins with a new margin property below them.

div#container {
    position: relative;
    [COLOR=Blue]margin-right: auto;
    margin-left: auto;[/COLOR]
    z-index:2;
    [COLOR=Red]margin: 2em;[/COLOR]
    width: 697px;
    height: 1405px;
}

Just use the shorthand property once.


div#container {
    position: relative;
    z-index:2;
    [COLOR=Blue]margin: 0 auto;[/COLOR]
    width: 697px;
    height: 1405px;    
}
3

Thanks for the response Stevie, and the recommendation of the validation site, very helpful. Well no more errors according to the w3, but chrome is still discriminating. Can anyone take a look and see what is probably glaring obvious?

Thanks.

4

It’s working fine for me in IE8, but yes, Chrome is keeping it all on the left.

The first thing you should do when you get buggy behaviour like this is to check your code validates: http://validator.w3.org/check?uri=http://www.joshlindo.com/
And … oops, it doesn’t.

You’ve set it to XHTML, but your <head> is full of elements using HTML syntax (ie, <link …> should be <link … />), which is messing a load of things up.

In the <body>, you’ve got a load of issues with incorrectly nested elements. One that I’ve picked out is that you’ve got <div>s inside <a>s - that isn’t allowed. <a> can only contain text and inline elements. You’ve got a construct of <p>…<p>…</p></p>, which doesn’t work either. And then, right at the end, you’ve got a <div> outside the <body>.

The first thing I would suggest is to go through it and fix those errors. If you’re lucky, that will do the trick and get IE to behave itself. If you’re unlucky, at least you’ll have a cleaner code base for us to look at and try to find the problem.