Align text and radio buttons

Hi experts, can someobody help me align all the elements here please, ie. get the "Send a text?" text to come down a tad in kline with the rest? (Preferably without using tables).

Ta,

 Col


 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body style="font-size:1.1em; font-family: Verdana, Arial, Helvetica, sans-serif;">
<form action="" method="post">
<div style="width: 80%; height: 20px;  vertical-align: bottom;">
			      <div style="width: 48%; text-align: right; height: 30px; float: left">Send a text ?</div>
				  
			      		<div style="width: 20%; float: left; text-align: right; vertical-align: middle;"><input type="radio" name="text_players" value="Y" >Yes please!</div>
			      		<div style="width: 25%; float: left; text-align: right; vertical-align: middle;"><input type="radio" name="text_players" value="N" checked >Not now thanks!</div>
  </div>
</form>
</body>
</html>

Open in new window

LVL 3
Colin BrazierAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Gurvinder Pal SinghCommented:
which browser?
i tested your code in IE8, Safari4, Chrome6, Opera10 and FF2. It is in same line.

Colin BrazierAuthor Commented:
Thanks for looking.  I must admit it looks better out of context.

Here's the same code from the live page (private I'm afraid!).

Col
aaaaa.JPG
Colin BrazierAuthor Commented:
I'm using IE8 and FF2
Fundamentals of JavaScript

Learn the fundamentals of the popular programming language JavaScript so that you can explore the realm of web development.

Colin BrazierAuthor Commented:
It becomes more apparent if the font size is reduced, to say 0.8em.
Gurvinder Pal SinghCommented:
Do you have the live internet link where i can see this happening?
Colin BrazierAuthor Commented:
No, sorry, as I said the site is private/password protected...well that part of it is, but you can see the effect in www.fobgfc.org/testee.php
Gurvinder Pal SinghCommented:
try this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>Untitled Document</title>
		<style>
			div div
			{
				 text-align: right; 
				 height: 20px; 
				 display: inline;
				 position:absolute;
			}
		</style>
	</head>

	<body style="font-size:0.8em; font-family: Verdana, Arial, Helvetica, sans-serif;">
		<form action="" method="post">
			<div style="width: 80%; height: 20px;">
				<div style="width: 48%;">Send a text ?</div>
				<div style="left:49%;width: 15%;"><input type="radio" name="text_players" value="Y" >Yes please!</div>
				<div style="left:65%;width: 15%;"><input type="radio" name="text_players" value="N" checked >Not now thanks!</div>
			</div>
		</form>
	</body>
</html>

Open in new window

Colin BrazierAuthor Commented:
Nope, still not right.
Gurvinder Pal SinghCommented:
can you update your internet link with this code, so that i can see here?
Colin BrazierAuthor Commented:
Hi, you can see it on www.fobgfc.org/testee2.php

I am out for the day now so cannot respond for a while. Thanks.
SHOABCommented:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<style>
body{font-family: Verdana, Arial, Helvetica, sans-serif;}

</style>


</head>

<body>
<form action="" method="post">

Send a text ?

<input type="radio" name="text_players" value="Y" >Yes please!

<input type="radio" name="text_players" value="N" checked >Not now thanks!

</form>
</body>
</html>

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Gurvinder Pal SinghCommented:
this worked for me

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>Untitled Document</title>
		<style>
			body
			{
				font-size:0.8em;
				font-family: Verdana, Arial, Helvetica, sans-serif;
			}
			div div
			{
				 text-align: right; 
				 height: 20px; 
				 display: inline;
				 position:absolute;
			}
		</style>
	</head>

	<body>
		<form action="" method="post">
			<div style="height: 20px;">
				<div style="width: 48%;margin-top:2px;">Send a text ?</div>
				<div style="left:49%;width: 15%;"><input type="radio" name="text_players" value="Y" >Yes please!</div>
				<div style="left:65%;width: 15%;"><input type="radio" name="text_players" value="N" checked >Not now thanks!</div>
			</div>
		</form>

	</body>
</html>

Open in new window

SHOABCommented:
you can use with out div or style this code,

pls tell me where are you doing job,

I am a web designer in noida,

shoabf@gmail.com
Colin BrazierAuthor Commented:
Sorry for the delay.

<<you can use with out div or style this code>>

Very strange - what was I doing wrong then?!

Thanks to Gurvinder, that works too.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.