LoganDeyo
LoganDeyo

Reputation: 113

Change input box: input area with CSS/HTML

So, I have a box that I want to use as my search box/input box. Although when I type on it, I can type on the whole image.

What I want to do, is to be only able to type in the white space of the image? Would I add padding to it?

This is my CSS:

input.searchbox {
background-color: #fff;
background:url(search.png) no-repeat;
width:250px;
height:41px;
border:none;
font-size:20px;
}

And here is my HTML:

<input type="text" class="searchbox" size="20" value="{Q}">

Also, how would I change the text size within the box?

Upvotes: 1

Views: 2499

Answers (2)

Laywah
Laywah

Reputation: 94

depending on your image (text location, what the text is) I used a table to hold the input (with image) and then in a seperate column had the submit button with a matching image next to it.

IMHO it really depends on the image that your using and how you are trying to match it up with the input field.

Upvotes: 0

d-_-b
d-_-b

Reputation: 23171

your image is a background image. so the text will write over it if necessary.

try putting in a seperate image with some margin between that and the text.

Upvotes: 1

Related Questions