tags:

views:

52

answers:

2

in my form I have three input fields name, email, mobile but I want to change input text box like -

name :  _____________  
email:  _____________  
mob  :  _____________  
+6  A: 

In your CSS:

input[type=text] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #000000;
}

From here you can play with padding to position the actual text entry where you would like it. For instance, to have the line extend 5 pixels either side of the actual entry area:

    padding: 2px 5px;
Matthew Scharley
You should probably use a class instead of the attribute selector to accommodate old browsers, though.
Joey
This'll work in IE7+, FF2+, Chrome, etc. If IE6 support is needed though, then a class or some other method is definitely recommended.
Matthew Scharley
A: 

if you want to this also in ie6 than you can use bg image for this with background-position

.

input{
    background:url(bg-dot.jpg) repeat-x center bottom;
    border:none;
    padding:2px 2px;
}

so for all browser support with ie6 you should use this.

kc rajput
I believe you mean `background-position`. Also, IE6 is dead. Please leave it that way, for the love of everything good in the world.
Matthew Scharley
@ Matthew Scharley.oh yes this is background-position. and about ie6.http://www.w3schools.com/browsers/browsers_stats.asp you find that ie6 users are more than safari and opera.if we care about them than we should also care about ie6.
kc rajput
what wrong with this answer???
kc rajput
@kc: But Safari and Opera are either going up in userbase, or staying static. IE6 usage is actively dropping. Many ISV's, including Google are dropping IE6. It is well and truely dieing, if you won't concede that it is dead, and it's about time.
Matthew Scharley
@Matthew that right but this answer is an option to use. and i think this is useful as nectar asked. we can use this option. if you don't want to use this than nothing but as nectar ask this is perfect answer.if we want to kill ie6 than this is not bad idea.
kc rajput
@kc: For the record, I didn't downvote you, just sharing my opinion. Also, I'm 90% sure my solution works for IE6, the only issue is the selector. Could be wrong though.
Matthew Scharley
@Matthew. your answer is correct and every developer and designer want to kill ie6 but as i know in India about 60% computer users have ie6.so in my case i have no chance to kill ie6.About my down vote i don't who do this.
kc rajput