How to create stylish text inputs for search, login or comment forms

You may have seen many stylish text inputs and designer forms in many websites. Just putting some text inputs and text areas and buttons, can't attract users to click there or type in some texts for you. If you wish your users grab those forms and fill out important information for you, you have to make those inputs in such a way that users get them accustomed with your site's theme. Users generally find no input forms to be interesting except it is a search box, which he/she have to use without any other option. But still f you make search inputs similar to your theme, it adds to your design and make it comfortable for your uses. After all designing is all about making elements soothing to users' eyes.

Here is a tutorial to make text inputs beautiful and matching to your website's theme. Suppose you have a login input in a bar, where users enter their passwords. Here is a sample how the input has been matched with the bar.

Here I have created a stylish input matching with the dark red colored background bar. Now lets see how you can implement it.

At first just insert normal form and input elements in your page like this.



Login:

View the source to get see the code.
This has inserted a form and a text input in your page. Notice that I have put an id="passText" in the input element. This will help you to stylize it through CSS. Now here is the CSS part.

#loginForm [
background: url(images/passText.jpg) no-repeat;
/* where passText.jpg is the stylish box image */
height: 20px;
width: 100px;
font-weight: normal;
color: #ffffff;
border: 0px;
}

#passText {
width: 80px;
height: 18px;
margin-left: 18px;
background: transparent;
color: #ffffff;
}


Now this will transform your input box just as you wished and seen in the picture. The form has the image for the text input in its background, and the input text's background is transparent. The size of the input text is made smaller than the form, so that the texts typed inside the input don't come out of the designed box.

This is the basis of form designing and in this pattern you can make your forms look beautiful and totally matching your site's theme, which adds beauty to your site. Now make designer forms and inputs and attract users to use them more and more.

Most Exciting Feature of Firefox

Firefox has been launched and claim to have more than 15,000 changes which are going to improve performance and stability of the browser. This version of Firefox i.e. Firefox 3 is based on the Gecko Web Rendering platform, version 1.9. Mozilla claims this version of Firefox to be much stable and with high performance value for its users. Mozilla claims this version of Firefox to be much stable and with high performance value for its users. Firefox 3 has also been improved in terms of security and sustainability, to provide its users more secure, easy and stable platform for web browsing.

MySpace Changes its Designing Look and Feel

I always had issues with MySpace looks. Though its obviously very easy and in your face type designing that MySpace had been till now, but its new looks have a cool effect which adds to MySpace reputation. I must say, MySpace is now looking real Web 2.0. The home page slide show is also very attracting and inviting to new users. The navigation at the top, after the header give a very well planned and concise look, which groups some alike menus.

How to Find MySpace Friend ID of Your Profile

MySpace manages its users through unique Friend ID, which is provided when you sign up to MySpace. This unique MySpace Id helps you to identify your profile and this also sets your primary MySpace url. Every users in MySpace has an unique Id and the users is known to MySpace by this Id. This id is called MySpace Friend Id.