How to do this?

[LiamProductions]

Hey.

 

How do i get a image in the background of a text box like this:

 

<input type="text" name="textfield">

 

how would i get a image to appear in the background of it?

[wildteen88]

give your input field a class, eg class="mytextfield":

<input type="text" name="textfield" class="mytextfield">

 

Then in your stylesheet/embed css. You'll use the following css:

.mytextfield {
    background-image: url(path/to/bg/image);
}

That'll apply a background image to your text field.

 

You could also do:

input.mytextfield {
    background-image: url(path/to/bg/image);
}

That will do the same, however it'll tell the browser to only apply the background to input tags that have a class name of mytextfield.

[jcombs_31]

or better yet apply the background right to the tag, e.g.,

 

input {
  background: transparent url(my_image.jpg) repeat;
}

 

assuming you want all of your inputs to look the same.  I usually style my forms for the section they are in.

 

for example if I have left or right columns or the main content area I may have something like

 

#left input {
...
}

#right input {
...
}

#content input {
...
}

 

and in my html of course something like

 

<div id="left"><form><fieldset><input ... /></fieldset></form>

 

you get the idea I hope.