Ok then, after talking with Nathan a bit i decided to move into a DIV / CSS Based layout instead of tables everywhere, and its been going pretty well and the code looks better to me but i'm not sure...

i have hit a small problem, i am wanting to get the 'container' in the exact middle of the page no matter what resolution, how would i do this? [code is below], btw im only making this for IE6/7 and Firefox based users for now

code:

---

#maincontainer {
    left: 30%;
    top: 200px;
    width: 400px;
    height: auto;
    margin: 0 auto;
    vertical-align: middle;
    padding: 5px;
    position: absolute;
    background-color: #FFFFFF;
    -moz-opacity: 0.65;
    filter: alpha(opacity=65);
}

---

add margin-left: -200px; (half of the div width) and left: 50%; to the div properties. That way, you're making it 50% from the left of the page to the middle of the div.


EDIT: You'll probably wanna use this too to make sure it acts properly ...

code:

---

div {
-moz-box-sizing: border-box;
box-sizing: border-box;
}

---

Sorry you misunderstood i think, thats the css code of the box, i want that box centred on the page, not content inside of that centred directly, i also want it completely centered on the page from the top and the side.

Also...Is it possible that the height be specified by how much writing there is??

just get rid of the height atribute.

cant you do margin: auto; for ff and text-align: center; in parent for ie?

i'm not sure if auto margin works for vertical align

also you will need to have set height and width

no it doesnt, i asked him to try that too. And its not margin: auto, its margin: 0 auto; 

Try this: http://exanimo.com/examples/css/vertical-centerin...-floated-shim.html

Source: http://exanimo.com/css/vertical-centering-with-a-floated-shim/

for the vertical alignment:

code:

---

div {
vertical-align:middle;
}

---

Here's an example I just coded up: You should be able to learn from it

http://skoolfun.com/center.htm

Hope it helps

quote:

---

Originally posted by Eddie
Sorry you misunderstood i think, thats the css code of the box, i want that box centred on the page, not content inside of that centred directly

---

quote:

---

Originally posted by Napbree
Here's an example I just coded up: You should be able to learn from it

http://skoolfun.com/center.htm

Hope it helps

---

quote:

---

Originally posted by Napbree
Here's an example I just coded up: You should be able to learn from it

http://skoolfun.com/center.htm

Hope it helps

---

quote:

---

Originally posted by hmaster
Try this: http://exanimo.com/examples/css/vertical-centerin...-floated-shim.html

Source: http://exanimo.com/css/vertical-centering-with-a-floated-shim/

---

quote:

---

Originally posted by .Lou
for the vertical alignment:

code:

---

div {
vertical-align:middle;
}

---

---

The easy way to do this?

Simply put everything you want aligned in an another div, and on the html page write.

code:

---

<div align='center>
     <div class='container>
     </div>
</div>

---

code:

---

#container
{
position:relative;
top:30%;
}

---

quote:

---

Originally posted by alby
As for the vertical, depending on how big your container is (e.g. 40%), you would simply have to do : (100% - 40%) /  2, and then use the result ( 30% here) and use it as top in your position propriety.

---

quote:

---

Originally posted by alby

code:

---

<div align='center>
     <div class='container>
     </div>
</div>

---

---

code:

---

<div style="align:center;">
<div class="container">
stuff here
</div>
</div>

---

quote:

---

Originally posted by .Lou

quote:

---

Originally posted by alby

code:

---

<div align='center>
     <div class='container>
     </div>
</div>

---

---

First of all, that's incorrect. Also, it's not xhtml valid.

code:

---

<div style="align:center;">
<div class="container">
stuff here
</div>
</div>

---

---

i had a fiddle with these different methods, none of which worked