Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

How to set html input field transparent on a transparent div?

How to set html input field transparent on a transparent div?

Problem

I have a div set Transparent with rgba and want on that div an Input Field which also has a transparent background. The problem is that the input field background is not rendered transparent. It works if I use opacity:0.8; on the div but than also the text is transparent, so I need rgba. For the second input field which is outside of the transparent div rgba works.

Here my example code:




Insert title here
Input 1

Any ideas?

Thanks!

Nathanael

Problem courtesy of: Nathanael

Solution

Hey Nathaneal its working fine if i chang the rgba value so text is not going to transparent

input {
background-color: rgba(0,0,0,0.1);
color: red;
border: none;
}

i hope this will help you... you can see the demo :- http://jsbin.com/avupaw/16/edit#html,live

Solution courtesy of: Shailender Arora

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

How to set html input field transparent on a transparent div?

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×