HTML - How To Align A <td> In This Form

Hi, I wonder if anyone could help me solve what is probably a very simple problem.
My website is www.danmondayeteaching.com
In Chrome and Safari it displays how I want it.
However, in IE my e-mail address will not align right.
In Firefox there is a thin black border to the cell with my e-mail address in.
I've tried lots of ways to solve the problem to no avail.
Here is the offending code:

<tr>
<td nowrap width="80%" border= "0" style="border-style: none; border-width: medium" height="102">
<p style="margin-left: 6; margin-top: 0; margin-bottom: 0"><b><font color="#FFFFFF" size="6" face="Verdana">Dan Monday E-teaching</font></b>
</p>
<p style="margin-left: 6; margin-top: 0; margin-bottom: 0; horizontal-align: middle"><b><i><font color="#A8E1F2" face="Verdana">
<img src="skypelogo.png" alt="Skype" img style="vertical-align:middle"> your way to better English</font></i></b>
</td>
<td width= "20%" border= "0" style="border-style: none; border-width: medium" height="102"><td align= "right">
<p style= "text-align: right; margin-right: 28;"><b><font color="#FFFFFF" size="4" face="Verdana">monday.daniel@gmail.com</font></b></p></td>
</tr>

tldr - IE won't align my e-mail address to the right.

Thanks in advance for any suggestions.

why can't i align my texarea and my three side panels?

http://www.hottunaint.com/press7test.html

i have this 2 images

firefox


ie7



how can i make the page in in intenret excplorer to look like in firefox?

here is the code PHP Code:
<?php
        include("muzica/config.inc");
        $link = mysql_connect($mysql_host, $mysql_username, $mysql_password);
        $result = mysql_query("SELECT id, name, artist, catagory, size FROM ".$mysql_database.".songs ORDER BY id DESC LIMIT 5;");
        for($i = 0; $i < mysql_num_rows($result); $i++)
        {
                                                                                                
                                                                                                echo "<br style=\"line-height:3px\">";
                                                                                                
                                                                                                echo "<table  width=\"100%\"><tr><td width=\"80%\"><img src=\"images/marcer.gif\" align=\"left\" style=\"margin-left:6px; margin-right:6px\"><span class=\"orange\"><a href=\"muzica/browse.php?catagory=".mysql_result($result, $i, "catagory")."\" class=\"orange\">".mysql_result($result, $i, "artist")." - ".mysql_result($result, $i, "name")."</a></td> <td>".mysql_result($result, $i, "size")."</td> </tr></table></span>";
                                                                                        
                                                                                            echo "    <br style=\"line-height:9px\">";
                                                                                                echo "<img src=\"images/hl2.gif\"><br>";
                                                                                                
                                                                                                }
        mysql_free_result($result);
        mysql_close($link);
        ?>

Hi every one.
Well i have a problem with align="center"
In tow PCs this align not working (its not coming to center)
In one PC that i tried somehow its work.
I did the same in all 3 PCs.
So my question is why ???

Thanks

I have three DIV:

<!-- Top 5 Hotels -->
<div id="top5container">
HOTELS/RESORTS<br />
</div>

<!-- Top 5 Restaurants -->
<div id="top5container">
RESTAURANTS
</div>

<!-- Top 5 Shows -->
<div id="top5container">
ENTERTAINMENT
</div>

I want to wrap those three DIVs (most likely in another DIV) and have them centered in this DIV. See www.vegastraveling.com and see on the welcome page. I want the 3 "top 5" to be centered... but I can't seem to have it work

So it's basically centering 3 DIVs within a DIV.

Hi,

Can anyone tell me how i can accomplish this:

http://www.tendervendors.com/dev/index-table.html

without using display: table-cell.

Atm, the exact same code, just without display: table-cell displays:

http://www.tendervendors.com/dev/index.html

Anyone got any ideas?

TIA

Matthew Millar

I'm trying to make this page/table align to the top of the page so that when the entire page is maximized, it will still "stick" to the top rather than in the middle of the page.

The editor I am using (Visual Studio 2003) shows that it is at the top of the page but when running it and maximized the page, the content is centered to the middle of the page. Any ideas on how to resolve this?

It is using a bit of CSS too.....

Code:

<body bottomMargin="0" rightMargin="0" MS_POSITIONING="GridLayout">
		<form class="crm" id="crmForm" method="post" runat="server">
			<table height="100%" cellSpacing="0" cellPadding="0" width="100%" border="0">
				<tr>
					<td>
						<table height="100%" cellSpacing="0" cellPadding="0" width="100%">
							<TBODY>
								<tr>
									<td>
									<div class="simon">
											<table style="TABLE-LAYOUT: fixed" cellSpacing="0" cellPadding="0" width="100%" border="0">
												<COLGROUP>
													<col width="110">
													<col>
													<col>
													<col width="120">
													<TBODY>
														<tr>
														</tr>
														<tr>
															<td style="FONT-WEIGHT: bold; BORDER-BOTTOM: black 1px solid" height="24">&nbsp;</td>
															<td style="FONT-WEIGHT: bold; BORDER-BOTTOM: black 1px solid" height="24">Candidate 
																Details</td>
															<td style="FONT-WEIGHT: bold; WIDTH: 299px; BORDER-BOTTOM: black 1px solid" height="24">Vacancy 
																Details</td>
															<td style="FONT-WEIGHT: bold; BORDER-BOTTOM: black 1px solid" height="24">Filtering 
																Options</td>
														</tr>

<!--etc..... -->

css:

Code:

formButton 
{
   background-color:    #6699cc;
   padding:          2px 4px 3px 4px;
   color:             #000000;
   font-size:         8pt;
   font-family:      tahoma;
   height:            17px;
   filter:          progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
             StartColorStr=#B4C5DF, EndColorStr=#91A9D0);
   border-width:       0px;
}

TEXTAREA
{
   font-size:         8pt;
   font-family:      tahoma;
   width:            100%;
   height:            100%;
   border:            1px solid #7b9ebd;

}

.inputfields
{
   font-size:         8pt;
   font-family:      tahoma;
   width:            100%;
   height:            19px;
   border:            1px solid #7b9ebd;
}

INPUT.rad
{
   width:            15px;
   border:            0px;
   cursor:            hand;
}

DIV.tab
{
	overflow-y:			auto;
	padding: 10px;
}

TD.sec
{
	width:				100%;
	color:				#000000;
	font-weight:		bold;
	padding-left:		0px;
	padding-bottom:		2px;
	text-overflow:		ellipsis;
	overflow:			hidden;
}

TD 
{
   font-size:         11pt;
   font-family:      tahoma;
}

TD.bar 
{
	border-bottom:		1px solid #000000;
}


TD.req 
{
	font-weight:		bold;
	color:				#9F2409;	
	overflow:			hidden;
	text-overflow:		ellipsis;	
	padding-top:		5px;
}

TD.statusBar
{
	background-color:	#63769B;
	color:				#ffffff;
	padding-left:		5px;
	height:				24px;
	border-bottom:		1px solid #485673;
	font-weight:		bold;
}


LABEL
{
   cursor:            hand;
}

TD.radioLabel 
{
   padding-left:      2px;
   padding-right:      10px;
}

TABLE.layout
{
   table-layout:      fixed;
   width:            100%;
   height:            100%;
}

div.tab
{
   width: 100%;
   height: 100%;
   border: 1px solid #466094;
   background-color: #EEF0F6;
   display: none;
}

body
{
	font-size: 11px;
	margin:	0px;
	border: 0px;
	background-color: #EEF0F6;
	cursor: default;
}

td
{
   font-size: 11px;
}

table
{
   cursor: default;
}

a
{
	color: #0000ff;
	font-weight: bold;
}

span.menu
{
   height: 100%;
   padding: 2px;
   padding-left: 5px;
   padding-right: 5px;
   border: 1px solid #7288AC;
}

table.mnuBar
{
	color: #000000;
	height: 22px;
	width: 100%;
	filter:	progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#DCDFE5, EndColorStr=#BDC2CB);
}

td.mnuTitle
{
   font-size: 11px;
   font-weight: bold;
   letter-spacing: 1px;
   cursor: default;
   color: #000000;
}

td.mnuRight
{
   width: 100%;
   text-align: right;
   padding-right: 5px;
}

DIV.header
{
	font-size: 20px;
	font-weight: bold;
	color: #000099;
	margin-bottom: 20px;
	border-bottom: 1px solid #000044;
}
			
TR.header
{
	font-weight: bold;
	background-color: #E0E3E8;
}

th
{
	border-right:0;
	border-left:0;
	background:url(imgs/bar_line.gif) left center no-repeat;
}

dataGrid.Table
{
	border-collapse: collapse;
	border-spacing: 0;
	background-color: #000000;
}

dataGrid.td, th
{
	margin:0;
	padding:0;
}

.Glass
{
 background-image:url(Img/Blank.gif);
 background-repeat:repeat-x;
}
.Glass:hover
{
 background-image:url(Img/GradientBlue.gif);
 background-repeat:repeat-x;
}

<td valign="top" background="" rowspan="9" width="666"><div style="width: 200; height: 200; background-color: transparent; font-family: arial; font-size: 11px; color: FF2222; font-weight: normal; font-style: normal; text-align: left; border-width: 1px; border-style: solid; border-color: 952716; overflow: auto; padding: 5px;">Test</div>

This is the code i have.

How would i move it away from the top and left side by a certain amount of pixles?
For example, 100 pixles from top and 50 from left side.

i have a javascript running a scrolling text on my site and im trying to position it to either align to the right or set x,y coordinates... i already tried putting align =right in the tag and it didnt work here is what im working with...

http://www.freewebs.com/fallingrain11/1.html

here is the call up im using i also
<iframe width="165" height="215" src="irawr-scrollernewstic.html" SCROLLING="no" FRAMEBORDER="0" border=0></iframe>

Dear users,

I have been having some trouble for quite sometime with both align and valign, I want to keep a iframe (Google Maps) absolutely centered regardless of the browser window size. This works fine for me until I want to add a picture on the page. When I add the picture I want it to be overlapping just slightly to the left of the iframe and stay like that regardless of window size also.

I'm sure its just a basic container problem, but it also makes it harder when I'm using percentages. If anyone is having problems with what I'm trying to explain just ask and I'll try explain it a little bit better.

http://www.autohotkey.net/~happytodd/index.html

HTML Code:

<style type="text/css">

#container{

position: relative;

min-width:700px;

min-height:100px;

}



#title

{

font-size: 65px;

}

#google

{



}

#image

{

border: 1px;

}

</style>



<body>

<div id="container">

	<div id="google">

		<div id="image">

		



<table border="1" cellpadding="0" cellspacing="0" width="100%" height="100%"><tr><td align="center" valign="middle">

<div id="title"><b>Where is Happytodd?</b></div> <br />



		<img src="there_myselfEeek1.png" alt="Avatar"/>	

		</div>



<!-- Google Public Location Badge -->

<iframe src="http://www.google.com/latitude/apps/badge/api?user=-7616294934996694352&type=iframe&maptype=roadmap" width="500" height="500" frameborder="0"></iframe>

<!-- To disable location sharing, you *must* visit https://www.google.com/latitude/apps/badge and disable the Google Public Location badge. Removing this code snippet is not enough! -->

		</td></tr>

	</div>

</div>



</body>

Hello

I have images on my site found here. You can see them on the top news bar, RSS feed, Facebook, Twitter How can I make those same line, aligned to the right.

Here is the current code for this section.

HTML Code:

                      <div id="contenttitle">RuneHints, Clan &amp; RuneScape News <a href="http://feeds.feedburner.com/RunehintsNews"><img src='http://runehints.com/forums/public/style_images/master/feed.png' alt='RSS Feed' id='rss_feed' class='clickable' /></a><a href="http://www.twitter.com/runehints"><img src="http://twitter-badges.s3.amazonaws.com/t_mini-a.png" alt="Follow runehints on Twitter"/></a><a href="http://feeds.feedburner.com/RunehintsNews"><img src="http://runehints.com/images/f_logo.png" alt="Follow RuneHints on Facebook" width="16" height="16" /></a></div>

Hi I am trying to align these pics side by side. I am using html

<p><a href="car.jpg"><img src="car.jpg" border="0"><br>full size</a></p>
<p><a href="car.jpg"><img src="car.jpg" border="0"><br>full size</a></p>


The text is aligned using css to the center and that works fine.

I'm having trouble trying to align an image to the top and right.
If I just use <img src="" align=right> it goes right as far as I want it, but for some reason the image falls below the text line and appears odd.

If I use <img src="" align=top> it goes with the text line like it should, but then it's not to the right like it should be.

Isn't there some way to combine the two?

<img src="" align=right align=top> doesn't work.

Thanks in advance.

Hello Guys,

I have made some page with nested div's. I made it's width to 80%. I want that to be completely aligned to center of the page. I tried with css and with html and with parent div. But some thing makes it not to work. Can you see the below code and please suggest me to get that to center.

HTML Code:

<style type="text/css">
.nm-left { text-align:left; vertical-align:text-top; }
.nm-left .nm-video, .nm-right .nm-video-reverse, .nm-left .nm-avatar,  .nm-left .nm-avatar-wrapper, .nm-left span.nm-button, .nm-left #user-form input#submit { float:left; }
.nm-right { text-align:right; vertical-align:text-top; }
.nm-right .nm-video, .nm-left .nm-video-reverse, .nm-right .nm-avatar, .nm-right .nm-avatar-wrapper, .nm-right span.nm-button, .nm-right #user-form input#submit { float:right; }
.nm-wrapper { clear:both; font-size:14px; line-height:21px; margin:20px 0; padding:0px; }
.nm-wrapper div { background-position:99% 10px; background-repeat:no-repeat; margin:0; padding:0; }
.nm-wrapper div div { }
.nm-wrapper div div div { overflow:hidden; }
#ninjamonials .nm-wrapper div div div div { background:transparent; padding:20px;}
#ninjamonials .nm-wrapper div div div div div { padding:0; }
blockquote.nm-summary div, blockquote.nm-testimonial div, blockquote.nm-summary, blockquote.nm-testimonial, blockquote.nm-summary p, blockquote.nm-testimonial p { background:transparent; border:none; padding:0; margin:0; text-decoration:none; font-style:normal; }
span.nm-button, #user-form input#submit { margin:5px; }
#user-form { background-position:left bottom; background-repeat:repeat-x; clear:both; font-size:14px; line-height:21px; margin-top:20px; padding:5px; }
.nm-testimonial, .nm-summary, .nm-author { padding-left:140px }
.nm-summary { font-weight:bold; }
.nm-author { display:block; font-size:12px; }
.nm-name { font-weight:bold; padding-right:5px; }
.nm-video, div.nm-video-reverse { margin:10px !important; }
.nm-audio, .nm-author { padding:5px !important; }
.nm-audio { display:block; }
.nm-name { font-style:italic; }
/* Oceanic Avatar-Specific CSS */
.nm-avatar { }
.nm-avatar img { background-color:#F7F7F7; border:1px solid #DBDBDB; margin:10px; padding:5px; }
/* Oceanic Module-Specific CSS */
.nm-module { overflow:hidden; margin: 5px; padding:4px!important; }
.nm-module div.nm-avatar img { }
.nm-module div.nm-avatar { }
/* Blue Style */
.nm-right.nm-oceanic-blue.nm-module, .nm-right.nm-oceanic-blue .nm-module { background:#EFF8FF url(oceanic_blue_tl.png) no-repeat -10px -10px; border:1px solid #D5ECFF; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-blue.nm-module, .nm-left.nm-oceanic-blue .nm-module { background:#EFF8FF url(oceanic_blue_nq.png) no-repeat -10px -10px; border:1px solid #D5ECFF; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-right.nm-oceanic-blue .nm-wrapper { background:#EFF8FF url(oceanic_blue_tl.png) no-repeat; color:#666; }
.nm-left.nm-oceanic-blue .nm-wrapper { background:#EFF8FF url(oceanic_blue_nq.png) no-repeat; color:#666; }
.nm-oceanic-blue .nm-wrapper div { background:url(oceanic_blue_tr.png) no-repeat 100% 0; }
.nm-oceanic-blue .nm-wrapper div div { background:url(oceanic_blue_bl.png) no-repeat 0 100%; }
.nm-oceanic-blue .nm-wrapper div div div { background:url(oceanic_blue_br.png) no-repeat 100% 100%; }
.nm-oceanic-blue #user-form { background-color:#EFF8FF; border:1px solid #D5ECFF; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-blue .nm-avatar-wrapper { margin:0 10px 10px 0; min-height:70px; min-width:90px; background: url(oceanic_blue_quote.png) no-repeat 10px 10px !important; }
/* Green Style */
.nm-right.nm-oceanic-green.nm-module, .nm-right.nm-oceanic-green .nm-module { background:#EBF4D7 url(oceanic_green_tl.png) no-repeat -10px -10px; border:1px solid #9AC740; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-green.nm-module, .nm-left.nm-oceanic-green .nm-module { background:#EBF4D7 url(oceanic_green_nq.png) no-repeat -10px -10px; border:1px solid #9AC740; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-right.nm-oceanic-green .nm-wrapper { background:#EBF4D7 url(oceanic_green_tl.png) no-repeat; color:#666; }
.nm-left.nm-oceanic-green .nm-wrapper { background:#EBF4D7 url(oceanic_green_nq.png) no-repeat; color:#666; }
.nm-oceanic-green .nm-wrapper div { background:url(oceanic_green_tr.png) no-repeat 100% 0; }
.nm-oceanic-green .nm-wrapper div div { background:url(oceanic_green_bl.png) no-repeat 0 100%; }
.nm-oceanic-green .nm-wrapper div div div { background:url(oceanic_green_br.png) no-repeat 100% 100%; }
.nm-oceanic-green #user-form { background-color:#EBF4D7; border:1px solid #9AC740; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-green .nm-avatar-wrapper { margin:0 10px 10px 0; min-height:70px; min-width:90px; background: url(oceanic_green_quote.png) no-repeat 10px 10px !important; }
/* Grey Style */
.nm-right.nm-oceanic-grey.nm-module, .nm-right.nm-oceanic-grey .nm-module { background:#EFEFEF url(oceanic_grey_tl.png) no-repeat -10px -10px; border:1px solid #999; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-grey.nm-module, .nm-left.nm-oceanic-grey .nm-module { background:#EFEFEF url(oceanic_grey_nq.png) no-repeat -10px -10px; border:1px solid #999; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-right.nm-oceanic-grey .nm-wrapper { background:#EFEFEF url(oceanic_grey_tl.png) no-repeat; color:#666; }
.nm-left.nm-oceanic-grey .nm-wrapper { background:#EFEFEF url(oceanic_grey_nq.png) no-repeat; color:#666; }
.nm-oceanic-grey .nm-wrapper div { background:url(oceanic_grey_tr.png) no-repeat 100% 0; }
.nm-oceanic-grey .nm-wrapper div div { background:url(oceanic_grey_bl.png) no-repeat 0 100%; }
.nm-oceanic-grey .nm-wrapper div div div { background:url(./images/oceanic_grey_br.png) no-repeat 100% 100%; }
.nm-oceanic-grey #user-form { background-color:#EFEFEF; border:1px solid #999; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-grey .nm-avatar-wrapper { margin:0 10px 10px 0; min-height:70px; min-width:90px; background: url(./images/oceanic_grey_quote.png) no-repeat 10px 10px !important; }
/* White Style */
.nm-right.nm-oceanic-white.nm-module, .nm-right.nm-oceanic-white .nm-module { background:#FFF url(oceanic_white_tl.png) no-repeat -10px -10px; border:1px solid #E8E8E8; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-white.nm-module, .nm-left.nm-oceanic-white .nm-module { background:#FFF url(oceanic_white_nq.png) no-repeat -10px -10px; border:1px solid #E8E8E8; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-right.nm-oceanic-white .nm-wrapper { background:#FFF url(oceanic_white_tl.png) no-repeat; color:#666; border:1px solid #E8E8E8; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-white .nm-wrapper { background:#FFF url(oceanic_white_nq.png) no-repeat; color:#666; border:1px solid #E8E8E8; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-oceanic-white .nm-wrapper div { background:url(oceanic_white_tr.png) no-repeat 100% 0; }
.nm-oceanic-white .nm-wrapper div div { background:url(oceanic_white_bl.png) no-repeat 0 100%; }
.nm-oceanic-white .nm-wrapper div div div { background:url(oceanic_white_br.png) no-repeat 100% 100%; }
.nm-oceanic-white #user-form { background-color:#FFF; border:1px solid #E8E8E8; -moz-border-radius:5px; -webkit-border-radius:5px; }
.nm-left.nm-oceanic-white .nm-avatar-wrapper { margin:0 10px 10px 0; min-height:70px; min-width:90px; background: url(oceanic_white_quote.png) no-repeat 10px 10px !important; }
.nm-audio1 {padding:5px !important; }
.nm-summary1 {padding-left:140px }
</style>                                   
<div id="ninjamonials" class="nm-oceanic-grey nm-left" style="width:80%">
          <!--bof nm-wrapper -->
  <div class="nm-wrapper">
    <div>
      <div>
        <div>
                              <div class="nm-content">
            <div class="nm-avatar-wrapper">
                          </div>
                                                <blockquote 
class="nm-testimonial">
              <p>This is a testimonial test. This is a testimonial test.   This is a testimonial test. This is a testimonial test. This is a   testimonial test. This is a testimonial test. </p>
              <p>This is a testimonial test. This is a testimonial test. This is a   testimonial test. This is a testimonial test. This is a testimonial   test. This is a testimonial test. </p>
                                </blockquote>
                                    <div class="nm-author">
                            <span class="nm-name">Name</span>
               (Website<span class="nm-title"></span>
               ~               <span class="nm-auth-url"><a 
href="http://www.google.com/">www.google.com</a></span>
              ,               <span class="nm-location">Mine</span>
               )                           </div>
            <!--eof nm-author --> 
          </div>
          <!--eof nm-content -->
                    <!--eof wrapper --> 
        </div>
      </div>
    </div>
  </div>

  <div class="nm-wrapper">
    <div>
      <div>
        <div></div></div></div></div></div>

Waiting for your solution.
Thanks in advance!