View Full Version : css to position a form on top of an image in a layout table

05-12-2009, 08:57 AM
<div align="center">
<table width="969" border="0" cellpadding="0" cellspacing="0">
<td width="1032" height="108" valign="top"><div align="center"><img src="images/bar.jpg" width="961" height="108" /></div></td>
<td height="219" valign="top"><div align="center">
<form name="login" id="login" method="post" action="#">
<input type="text" name="user" tabindex="1" />
<input type="password" name="password" tabindex="2" />
<input type="submit" name="Submit" value="Submit" tabindex="3" />

I have this code to put a form on my site.
However, I don't know how to position it on top of an image I have in a layout table.
I would like it to appear on top NOT underneath as it does at the moment.

05-12-2009, 09:30 AM
do you mean the image as a background?

05-12-2009, 09:33 AM
The image should be a background so the form can be place on top.
However I can't seem to do this very well in css

05-12-2009, 09:38 AM
use a div instead of a table and css background-image.
tables are not really for layout

05-12-2009, 10:00 AM
Is it possible for you to write that div - I am a newbie - not too sure what div is. I just use dreamweaver and layout tables.

05-13-2009, 01:38 AM
in its simplest form so you can read up and add what you want/need
#text {

width: 961px;
position: relative;
background-image: url(images/bar.jpg);
background-repeat: none;

and use
<div id="text">
type what you want here


05-14-2009, 12:14 AM
can\t you just apply the background image to the form element? rather than crating unnecessary html?