• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Add icons to your registration form

Russ

Well-known member
#1
Russ submitted a new resource:

Add icons to your registration form (version 1.0) - icons in registration form

This is a simple modification to spice up your registration form. This will add icons to each input text field.

An example can be found at:

http://gamerexit.com/register/
View attachment 39816


Step 1.) Add a unique ID to the registration form(could be other ways or approaching it I took this route, this is so these icons will only effect on the registration form and you can also make other changes to the form easily as well)

In register_form

Find:

Code:
<form...
Read more about this resource...
 

Tracy Perry

Well-known member
#2
One thing I noticed is that your text overwrites the image if you use the default code.
Code:
background-position:8px;
I used
Code:
background-position:98%;
and it places the images to almost the far right where they don't interfere with the text input.
 

xenTheory

Active member
#3
One thing I noticed is that your text overwrites the image if you use the default code.
Code:
background-position:8px;
I used
Code:
background-position:98%;
and it places the images to almost the far right where they don't interfere with the text input.
That's a better way of doing it since IE doesn't like text-indent:, there are workarounds however it's not ideal and further complicates the code.
 

xenTheory

Active member
#4
Here's a screenshot with the background-position:98%; implemented. Tested in IE10, Chrome, Firefox and Opera.

EDIT:

Here's the code the recaptcha part.

Code:
#recaptcha_response_field {
    background-image:url(#);
    background-position:98%;
    background-repeat:no-repeat;
}
Untitled-7.png