Shoutbox

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

---

Cool, but box to big and i dont understand how you did that because you just told me to delete the height attribute!

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/

---

i could of done a search but i decided to ask here because its easier and i get multiple opinions.

quote:

---

Originally posted by .Lou
for the vertical alignment:

code:

---

div {
vertical-align:middle;
}

---

---

will try that thanks.

i will edit once tried these. thanks.

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>

---

Saves you from a bunch of problems to center-it horizontally. 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.

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.

---

That's fine if you have a fixed size, which he doesn't

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>

---

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>

---

---

Cheers, will try that tomorrow

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