[thelist] aligning form image buttons
Garrett Coakley
garrett at polytechnic.co.uk
Wed Jun 30 03:09:30 CDT 2004
On Tue, Jun 29, 2004 at 11:42:36AM -0400, Dan McCullough wrote:
> I usually don't bother with this as I usually have the submit
> button/image off by itself. In this design the fact that it doesn't
> line up is very evident. I need to align it to the bottom of the text
> box and it does seem to do that.
Presuming I've understood your request correctly...
Just grabbed this from a site I'm working on at the minute. Lines up
in IE5/5.5/6 but it's a little off in Gecko based browsers. If
pixel precision is important, then you could probably take care of
that by using a CSS filter to feed Gecko slightly different margins on
the button.
I've put a screenshot of the render (IE6) up at
http://polytechnic.co.uk/evolt/input_submit_lineup.png so you can see
the result.
label {
margin: 0 0 0 0;
padding: 0 0 0 0;
display: block;
}
input[type=text] {
margin: 2px 0 0 1em;
}
input.go {
margin: 0 0 2px 2px;
padding: 0 0 0 0;
vertical-align: bottom;
}
<form method="get" action="search.php">
<fieldset>
<label for="keywords">Quick Search</label>
<input type="text" name="keywords" id="keywords" value="" />
<input type="image" src="search.gif" name="submit" class="go" value="Go" />
</fieldset>
</form>
HTH
G.
--
------------------------------------------------------------------------
Work : http://www.gencon.co.uk & http://spiked.co.uk
Play : http://polytechnic.co.uk
Learn : http://evolt.org
More information about the thelist
mailing list