form button margin

Hi.

I am using a background image in a form button. The problem I am
having is that there is a 1 pixel margin inside the button on all
sides.

I would like my background image to fill the inside of the button from
button border to button border, and not stop 1 pixel shy of that.

I have tried:
margin-top:0; margin-left:0; margin-right:0; margin-bottom:0;

This does nothing.

Also:
margin-top:-1; margin-left:-1; margin-right:-1; margin-bottom:-1;

This does get rid of the margin, but it also gets rid of the button
border.

This is what I'm using and it mostly works...the only problem is the 1
pixel buffer inside the button:

..fbutton1 {
text-align:middle; vertical-align:top;
font-family:Arial,Verdana; font-size:11px; font-weight:bold;
color:#000000;
background-image: url(../images/button_fill1.jpg);
border-top:#EFF4F9; border-bottom:#62707D; border-left:#EFF4F9;
border-right:#62707D;
border-top-width:1px; border-left-width:1px; border-right-width:1px;
border-bottom-width:1px;
border-style:solid;
padding-top:0px; padding-left:0px; padding-right:0px;
padding-bottom:0px;
margin-top:0; margin-left:0; margin-right:0; margin-bottom:0;
}

Thanks.

On Wed, 07 Jul 2004 18:00:45 -0400, Brian
<usenet3 (AT) julietremblay (DOT) com.invalid> wrote:

.fbutton1 {
padding: 0;
}

Yes, it's padding that doesn't seem to want to go away. I have tried
your suggesstion and also form {padding:0} with no luck.

should work. It may be a browser issue. In any case, _as always_, we
need a url to help you.

The browser is the latest 6.x IE. I can't post the URL, but if you
think you can help, I can email you the one HTML and CSS file.

Are you sure you want to change the appearance of a form widget
that much?

Yes, I am absolutely positive. I am trying to get the forrm buttons to
look like all the other non-form buttons on the site. With out
resorting to images

If you do, at least consider simplifying a bit, and correct
the mistakes in design that you should have known about if you lurked
in ciwas for some time.

I've only just arrived!

Whoa!

The "proper syntax" changes you suggested I should do.

Things like specifying the left, right, top and bottom margins
individually instead of just margin:0 was done intentionally
because this is a "skin", and I am making it easier for users
to customize the settings.

No! Don't set font-size in px!

Why not?!? Ok, pt instead...

Thanks for your input! I'll make those syntax correction. Now
if I can just get rid of the padding.

-me-

Hmm. I found the answer.

Oddly enough, using this:

background:url(../images/button_fill1.jpg);

instead of this:

background-image: url(../images/button_fill1.jpg);

Eliminates the 1 pixel padding on the inside of the button. I'm
not sure why that is.

-me-

Actually, it didn't work, it just pretended to.


On Wed, 07 Jul 2004 19:35:50 -0400, moocow <nospam (AT) nospam (DOT) net> wrote:

Hmm. I found the answer.

Oddly enough, using this:

background:url(../images/button_fill1.jpg);

instead of this:

background-image: url(../images/button_fill1.jpg);

Eliminates the 1 pixel padding on the inside of the button. I'm
not sure why that is.

-me-

I have noticed that this 1 pixel padding on the inside of the
form button does not show up in Mozilla Firefox .8.

Won't that just confuse visitors? Wouldn't they want to be able to
distinguish between a form control and, uh, hang on, what do you mean,
"non-form buttons"? What do those buttons do?

No, they don't need to distinguish.

In this case, "non-form" buttons are just linked button images.

That was sort of my point. You might have learned about the problem
with pixel sized fonts or color without background color if you had
read the group for a bit. Instead, I'm generating more noise
explaining it to you.

I think that was a choice of your own free will.

Is this, finally, a www.authoring question? Or something else?

No, I have no www.authoring related questions.

Your preferred font-size is not the same as my preferred size, or the

Yes, but sometimes fonts need to be set and stay set...

On Thu, 08 Jul 2004 00:59:37 -0400, moocow <nospam (AT) nospam (DOT) net> wrote:

Your preferred font-size is not the same as my preferred size, or the

Yes, but sometimes fonts need to be set and stay set...

On the web they never will whatever you do. Different screen resolutions,
etc. cause the font to be different no matter what.

Might as well work with that. Use % to indicate font size. 100% is what
the user prefers to read, if the user set anything. If not, it's what the
user is accustomed to. So don't go too far below that.

px, whether it's legible or not to the user is anyone's guess. I thought
you wanted people to read your content?

On the web they never will whatever you do. Different screen resolutions,
etc. cause the font to be different no matter what.

I agree with all that. But...

This is not a public site, it's an internal web app with known
browsers, users and pre-existing standards.

On Thu, 08 Jul 2004 04:10:57 -0400, moocow <nospam (AT) nospam (DOT) net> wrote:

On the web they never will whatever you do. Different screen
resolutions,
etc. cause the font to be different no matter what.

I agree with all that. But...

This is not a public site, it's an internal web app with known
browsers, users and pre-existing standards.

Right. This isn't an intranet newsgroup either, though.

On Thu, 08 Jul 2004 05:18:45 -0400, Neal <neal413 (AT) yahoo (DOT) com> wrote:

Right. This isn't an intranet newsgroup either, though.

I appreciate your input on fonts, but how I might remove a stubborn 1
pixel of padding in a form button in IE using CSS when the standard
ways are not working...was the posted query.

I was not really interested in talking in circles or posturing.

If this is not the place to find out how I might remove a stubborn 1
pixel of padding in a form button in IE using CSS when the standard
ways are not working...then I have made an error.