Ok, so I designed my page for 800X600 and it looks good. But, in the resolution of 1024X768 it is left aligned, and I dont like that. I think there is a way to center my whole page, isn't there?? Like create a table and instead of setting the width with an integer, use a percentage is that it?? The site I am currently working on can be found at <!-- w --><a class="postlink" href="http://www.digitalonyxdesigns.com">www.digitalonyxdesigns.com</a><!-- w -->. Anyone know how I could make what you see when you go there all be in the center?? Thanks in advance!!<br />
<br />
- Moomancow<!--content-->You might be interested in this page, which shows how you can also vertically center your content, if you wish... <!-- m --><a class="postlink" href="http://www.infinitypages.com/research/verticalcentereddiv.htm">http://www.infinitypages.com/research/v ... reddiv.htm</a><!-- m --><!--content-->Thank you for that site, that is pretty cool. However, I looked at your source code and couldn't really figure out how you did it. Did you center it by using Java scripting, or by using HTML tag percentages??<!--content-->He basically used DHTML thus in a non-JavaScript enabled browser it would fail. You could have be naughty and used <center> to align the table horizontally or just plain CSS with a CSS enabled and compliant browser, for example; Mozilla Firebird.<br />
<br />
For instance, if I have a box that is 250px wide by 70px high, I could position it at absolute 50% from the top and 50% from the left of the page and its top left corner would be at the centre of the browser window. If I then give it negative left and top margins that are exactly half of its width and height, the box is put back smack bang in the middle of the window, no matter what size it is.<!--content-->I'm sorry, I'm a newbie...could you post some example code, or a link to a site where I could just view the source code for an example of this technique?? Thanks alot!!<br />
<br />
-Moomancow<!--content-->It would be far easier for you to just use the <center> element although this a complete CSS method of centering a box both horizontally and vertically.<br />
<br />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"<br />
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br />
<br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<br />
<title>CSS Centre</title><br />
<style type="text/css"><br />
body <br />
{<br />
color: white;<br />
background-color: black;<br />
margin: 0px;<br />
padding:0px;<br />
height: 100%;<br />
}<br />
#line <br />
{<br />
border-bottom : 1px dotted #FFF; <br />
border-top : 1px dotted #FFF; <br />
color: white;<br />
background-color: white; <br />
text-align: center;<br />
position: absolute;<br />
top: 50%;<br />
left: 0px;<br />
width: 100%;<br />
height: 1px;<br />
overflow: visible;<br />
visibility: visible;<br />
display: block<br />
}<br />
<br />
#content <br />
{<br />
font-family: Verdana, Geneva, Arial, sans-serif;<br />
background-color: white;<br />
margin-left: -125px;<br />
position: absolute;<br />
top: -35px;<br />
left: 50%;<br />
width: 250px;<br />
height: 70px;<br />
visibility: visible;<br />
border : 3px dotted #FFF; color: green;<br />
}<br />
</style><br />
</head><br />
<br />
<body><br />
<div id="line"><br />
<div id="content"><br />
<br /><br />
Centered Box<br /><br />
</div><br />
</div><br />
</body><br />
</html><!--content-->Thanks! I just used the <center> tag around my whole body...but now I'm really gonna test your knowledge...For the popup menu for my 'portofiolo' button at digialonyxdesigns, is there anyway instead of setting that there with those x, y coordinates like I have it now, with some sort of percentages or is there some way I can lock up that popup menu so it always pops up to the right of that button?? Thank you.<br />
<br />
[ <!-- w --><a class="postlink" href="http://www.digitalonyxdesigns.com">www.digitalonyxdesigns.com</a><!-- w --> ]<br />
<br />
<br />
<br />
- Moomancow<!--content-->
<br />
- Moomancow<!--content-->You might be interested in this page, which shows how you can also vertically center your content, if you wish... <!-- m --><a class="postlink" href="http://www.infinitypages.com/research/verticalcentereddiv.htm">http://www.infinitypages.com/research/v ... reddiv.htm</a><!-- m --><!--content-->Thank you for that site, that is pretty cool. However, I looked at your source code and couldn't really figure out how you did it. Did you center it by using Java scripting, or by using HTML tag percentages??<!--content-->He basically used DHTML thus in a non-JavaScript enabled browser it would fail. You could have be naughty and used <center> to align the table horizontally or just plain CSS with a CSS enabled and compliant browser, for example; Mozilla Firebird.<br />
<br />
For instance, if I have a box that is 250px wide by 70px high, I could position it at absolute 50% from the top and 50% from the left of the page and its top left corner would be at the centre of the browser window. If I then give it negative left and top margins that are exactly half of its width and height, the box is put back smack bang in the middle of the window, no matter what size it is.<!--content-->I'm sorry, I'm a newbie...could you post some example code, or a link to a site where I could just view the source code for an example of this technique?? Thanks alot!!<br />
<br />
-Moomancow<!--content-->It would be far easier for you to just use the <center> element although this a complete CSS method of centering a box both horizontally and vertically.<br />
<br />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"<br />
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br />
<br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<br />
<title>CSS Centre</title><br />
<style type="text/css"><br />
body <br />
{<br />
color: white;<br />
background-color: black;<br />
margin: 0px;<br />
padding:0px;<br />
height: 100%;<br />
}<br />
#line <br />
{<br />
border-bottom : 1px dotted #FFF; <br />
border-top : 1px dotted #FFF; <br />
color: white;<br />
background-color: white; <br />
text-align: center;<br />
position: absolute;<br />
top: 50%;<br />
left: 0px;<br />
width: 100%;<br />
height: 1px;<br />
overflow: visible;<br />
visibility: visible;<br />
display: block<br />
}<br />
<br />
#content <br />
{<br />
font-family: Verdana, Geneva, Arial, sans-serif;<br />
background-color: white;<br />
margin-left: -125px;<br />
position: absolute;<br />
top: -35px;<br />
left: 50%;<br />
width: 250px;<br />
height: 70px;<br />
visibility: visible;<br />
border : 3px dotted #FFF; color: green;<br />
}<br />
</style><br />
</head><br />
<br />
<body><br />
<div id="line"><br />
<div id="content"><br />
<br /><br />
Centered Box<br /><br />
</div><br />
</div><br />
</body><br />
</html><!--content-->Thanks! I just used the <center> tag around my whole body...but now I'm really gonna test your knowledge...For the popup menu for my 'portofiolo' button at digialonyxdesigns, is there anyway instead of setting that there with those x, y coordinates like I have it now, with some sort of percentages or is there some way I can lock up that popup menu so it always pops up to the right of that button?? Thank you.<br />
<br />
[ <!-- w --><a class="postlink" href="http://www.digitalonyxdesigns.com">www.digitalonyxdesigns.com</a><!-- w --> ]<br />
<br />
<br />
<br />
- Moomancow<!--content-->