FRIHOSTFORUMSFAQTOSBLOGSDIRECTORY
You are invited to Log in or Register a Frihost Account!

Image and text not centering? :S

 


Diablosblizz
Hey, I have this following code below:

Code:
<tr>
<td width='100%' valign='top' align='center'><center><div class='blue_boxie'><font size='1'>Moderator Options</div></center>Woot!</td>
</tr>


As you can see, I have aligned it to center itself on the page TWICE, but it does not do so., I have tried on both IE and Firefox, and it does not work on both.

Does anybody have any idea why this is not centering in the <td>?

Many thanks!
brokenadvice
Your code is semantically correct (although makes my eyes bleed, use CSS already!). Check for an unclosed tag further up the page.
Diablosblizz
Advice, I did try to use CSS:

Code:
.center {
text-align: center;
}


Still didn't work. Also, there are no unclosed tags, that I know of.
dangerdog
this is actually working just fine when i put it into a test document and open it with firefox! just remember that setting that column width to 100% won't make it 100% of the page, it makes it 100% the width of the table. if you want it to span the whole page, set the table's width to 100% and then it should be in the center of the page. as it is, the table is just small, and it's centered inside of that.
Diablosblizz
Hmm, you're 100% right. The HTML does work in a blank .html file. Then it has to do with my coding somewhere. I'll check it out, and do a better look than before.

EDIT: I closed the table tag and then reopened it with 100% width and it worked.

Thanks for the help.
blueray
or you could use the div tag or the like to do the same think.

Code:
div.centerbox {
   margin: 0 auto;         /* center the div so you could add more item inside it  */
   width: 300px;
   border: dotted 1px #000000;
   padding: 5px;
}

<body>
<table width="100%" border="1" cellspacing="0">
<tr>
<td width='100%' nowrap="nowrap" valign='top' align='center'><center><span class='blue_boxie'><font size='1'>Moderator Options</span> Woot!</center></td>
</tr>
</table>
<span style="display:block;height:10px"></span>
<div class="centerbox">I'am the centered box</div>

<div style="text-align:center;padding:5px;">Ha Ha, I have center on you screen</div>
</body>


or go here to see a live demo.
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.