INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

How do you add a background image to a html/css form ?

How do you add a background image to a html/css form ?

(OP)
i want to achieve what this website has done with a mini form

http://www.5ivestarlondon.com/

just a text field and a submit button aligned horizontaly at the bottom of the image, it looks nice.

I want to achieve this same thing folks but i dont know how to begin.

How do you do this ?? it seems, or appears more difficult than I thought it would be.


any css/html junkies wizkids out there who are willing to help ?

RE: How do you add a background image to a html/css form ?

A background image and relative positioning.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

RE: How do you add a background image to a html/css form ?

Give your form a background image with CSS, and then simply adjust margins on your elements to push them down.
I wouldn't mess too much with positioning.

Personally something like:

CODE -->

<style type="text/css">

*
{
    padding:0;
    margin:0;
}

div.backgroundform
{
    background-color:#0066de;
    height:200px;
    width:300px;
    overflow:hidden;    
}
div.backgroundform form
{
    height:40px;
    overflow:hidden;
    margin-top:160px;
    padding-left: 10px;
    
}
div.backgroundform form input
{
    margin-right:6px;
}



</style>
</head>
<body>
<div class="backgroundform">
<form action=""...>
<input type="text"><input type="submit">
</form>
</div> 

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

RE: How do you add a background image to a html/css form ?

(OP)
Do you know something vacunita ?

we crossed paths many years ago on here - yet you really are a remarkably super smart praiseworthy coder glasses

thanks buddy - much appreciated. RELIABLE and PROFESSIONAL as always vacunita. Here, allow me to place this 'You ARE the Man' - 'virtual garland' around your neck lol

Now your raise your gold trophy skywards my boy !

* raptuous round of applause for vacunita *

lol

thumbsup

RE: How do you add a background image to a html/css form ?

Glad I could help. no need for all the praise. thumbsup2

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members!

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close