Simple HTML page. I am showing a large centered image. All's good.
on that image, there's a rectangle, part of the image. I'd like to put in a form within that rectangle. I've been successful with the form when it's a part of a div defined in CSS as:
.theForm
{
text-align: left;
background-color: #ffffff;
position: absolute;
top: 505px;
left: 50%;
margin-left: -350px;
height: 200px;
width: 450px;
padding: 0px 0px 0px 0px;
}
so far so good. I can resize the browser window and the form remains nicely in place thanks to the 50% and the margin-left values.
HOWEVER: if i reduce the width of the browser window below a certain threshold, the form breaks the left boundaries of the rectangle on the image. This is undesirable.
It seems like I'm missing a "minimum-absolute-left" value that I don't think exists in CSS.
Any advice what I can do?
