If you really want to use absolute positioning, why not wrap the label and
the textbox in their own <div>
Or better yet, set the class attributes on the items themselves:
Here is a new version of it:
<html>
<head>
<title>Untitled</title>
<style>
div.one { position: absolute; top: 50px; left: 100px }
.two { position: absolute; top: 50px; left: 200px }
div.three { position: absolute; top: 80px; left: 100px }
.four { position: absolute; top:80px; left: 200px }
.five { position: absolute; top:110px; left: 200px }
</style>
</head>
<body>
<div class="one">Login id:</div>
<input type="text" name = "loginid" value"" class="two" />
<div class="three">Password: </div>
<input type="password" name= "password" value="" class="four" />
<input type="submit" value="Submit" class="five" />
</body>
</html>
This way, you can control the layout of all elements in your page, without
the need to use HTML tables for lay-out.
HtH
Imar
At 07:08 PM 12/5/2002 +0000, you wrote:
>This is a sample of my html file
><div class="two">
>Login id: <INPUT type="text" name = "loginid" value"" >
></div>
><div class="three">
>Password: <INPUT type="password" name= "password" value="" >
></div>
><div class="four">
><INPUT type="submit" value="Submit" >
></div>
>
>This is my css file.
>body,input,select, a {color: rgb(0,64,128) }
>h2 { position: absolute; top: 10px; left: 300px }
>div.two { position: absolute; top: 50px; left: 300px }
>div.three { position: absolute; top: 80px; left: 300px }
>div.four { position: absolute; top: 110px; left: 300px }
>
>The labels for the fields loginid and password are aligned to the left
>when they get displayed but because of the character size,
>the text boxes dont align correctly. How do i solve this ? The only way i
>know is using the pre tag or using a monospaced font. I have read that the
>pre tag should not be used as it is a html tag and all the presentation
>needs to be handled by CSS.
>---
View Cart
