I designed below this form.
<form id="frmlgn" action="">
  <label for="username">Username:</label>
  <input id="username" name="" type="text" class="textBox" size="15" />
  &nbsp;&nbsp;
  <label for="pwd">Password:</label>
  <input id="pwd" name="" type="password" class="textBox" size="15" />
  &nbsp;&nbsp;
  <input name="" type="button" value="Login" class="buttonStyle" />
  <br />
  <a href="#" class="alignright">Forgot Password?</a>
</form>

This form is controlled through a CSS class file. Here is the class details:
#frmlgn{
float:right;
margin-bottom:20px;
}

The problem in browser is, the Forgot Password link aligns to left. I used a class to align it to right, that is not working. Can anybody help to fix it?

Shivanand Yerva

__________________
Shivanand

Although I would do a bit different from that, to avoid messing up with your code, here's my suggestion:

Instead of using "<br />" to break the line, put the link inside of a div and align the contents of this div on the right.

In other words, use the same code above and just delete the <br> tag and replace the next line for: <div class="alignright"><a href="#">Forgot Password?</a></div>

Of course, you'd have to add the class:
.alignright {
text-align:right;
}

This will do the job.

Thanks PauloAmado. You mentioned that you will do it differntly, let me know what is that approach.

Shivanand Yerva

Nothing wrong with your approach, Shiva. Actually, I find it pretty clean. When I said I would do different, I really meant "I have done differently before", but, of course, that will depend highly on the other elements of the page and the design you chose. Good luck with your work.

There is one thing I would do differently. alignright is a functional classname, it describes what you are trying to do to the element. I'd use a descriptive class name, one that describes what the element is, like class="forgotPassword". Otherwise, when you change your mind later (or your client changes your mind for you ), all of a sudden your CSS has things like

.alignright {
text-align:left
}

Worse, when you look at your XHTML code it's actually lying to you, because now it's not aligned to the right at all.

-------------------------

Whatever you can do or dream you can, begin it. Boldness has genius, power and magic in it. Begin it now.
-Johann von Goethe

When Two Hearts Race... Both Win.
-Dove Chocolate Wrapper

Chroniclemaster1, Founder of www.EarthChronicle.com
A Growing History of our Planet, by our Planet, for our Planet.