Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.
-
i wod like to know how to write css for something like this in the most easiest way ...
-
-
CommentAuthorbenjitastic
- CommentTimeDec 2nd 2007 edited
Hello,
Styling form elements can be quite challenging. Here is an article that might be helpful.
The submit button is fairly straightforward:<input type="image" src="submitButton.gif" value="Search" />
I would probably do something like this for the text input:input#textField {
border: 1px solid #BFBFBF;
background: url(searchIcon.gif) no-repeat 10px 5px;
padding-left: 30px;
height: 28px;
width: 150px;
}<input id="textField" type="text" value="search profiles" />
Add a little more styling and it would look like this (looks fine in IE and Firefox). But Safari will be the hardest one to please: -
-
thank you i will try it i had some complications and what you have provided i will surely implement it
thank you so much !!! -
What are the complications you are having?
-
Sorry but this approach doesn't work in IE 6 (don't know about 7, because I don't have it). If you type a long text the image is pushed out of the input field. Works OK in Firefox, though.
For a crossbrowser solution I recommend this:
HOWTO: spruce up your search box with CSS and a background image » d’bug
Yes, it requires more markup code and more CSS but I think this is the only way to make this work.
1 to 5 of 5