Stylesheets - how to remove Button shadow

Author

how to remove Button shadow

JohnSouth@WhereCanWeGo.com

2005-05-19, 8:09 am

Hi I've an image submit button on a form that needs to appear flat on
the surface. I can't get rid of the shadow that appears bottom and
right.

This is the best I can do.

<code>
..SearchButton
{
width=100;
margin-left:-5;
border-style:none;
cursor:hand;
}
</code>

Can any suggest settings that can remove the shadows?

Cheers

John South
Pangbourne

Roderik

2005-05-20, 4:22 am

JohnSouth@WhereCanWeGo.com wrote:
> Hi I've an image submit button on a form that needs to appear flat on
> the surface. I can't get rid of the shadow that appears bottom and
> right.

The following url explains how to style your submit button:
http://www.themaninblue.com/writing...ive/2004/04/28/

Michael Vilain

2005-05-20, 4:22 am

In article <428d43ba$0$1330$5fc3050@dreader2.news.tiscali.nl>,
Roderik <mail@roderik.net> wrote:

> JohnSouth@WhereCanWeGo.com wrote:
>
> The following url explains how to style your submit button:
> http://www.themaninblue.com/writing...ive/2004/04/28/

Yeah, but the info there doesn't work on Safari, Camino, or Opera 7 on
the Macintosh. The page didn't display very well in IE 5.2. It's
_really_ broken in iCab, but that's probably because iCab is really
broken on the Mac.

The form field didn't display on Safari either.

Why do lazy web designers assume that Windows is the _only_ platform?

--
DeeDee, don't press that button! DeeDee! NO! Dee...

T S Skogvold

2005-05-20, 8:10 am

On Thu, 19 May 2005 23:02:43 -0700, Michael Vilain
<vilain@spamcop.net> wrote:

>In article <428d43ba$0$1330$5fc3050@dreader2.news.tiscali.nl>,
> Roderik <mail@roderik.net> wrote:
>
>
>Yeah, but the info there doesn't work on Safari, Camino, or Opera 7 on
>the Macintosh. The page didn't display very well in IE 5.2. It's
>_really_ broken in iCab, but that's probably because iCab is really
>broken on the Mac.
>
>The form field didn't display on Safari either.
>
>Why do lazy web designers assume that Windows is the _only_ platform?

Because 1) they do what their clients ask and 2) clients are happy to
ignore a small minority of users due to budget constraints of ensuring
universal compatibility

--
Thomas

Steve Pugh

2005-05-20, 8:10 am

JohnSouth@WhereCanWeGo.com wrote:
> Hi I've an image submit button on a form that needs to
> appear flat on the surface. I can't get rid of the shadow
> that appears bottom and right.

> .SearchButton
> {
> width=100;

Incorrect syntax.

> margin-left:-5;

5 what?

> border-style:none;
> cursor:hand;

No such value.

> }

So when all the wrong stuff is removed your css boils down
..SearchButton { border-style:none; }

But you say that doesn't remove the border on some element?

> Can any suggest settings that can remove the shadows?

Form elements are often hard to style because in many cases they are
part of the operating system and hence not totally under the control of
the browser's rendering engine.

However, you say that this is an "image submit button". Do you mean a
<input type="image"> button? Most modern browsers will not show a
border around those if you use border: none; or border-width: 0;

If you don't mean <input type="image"> or if you don't mean a border
when you talk about 'shadows' then you'll need to post a URL showing
the problem and tell us which browsers demonstrate the problem.

Steve

Roderik

2005-05-24, 7:46 pm

Michael Vilain wrote:
> In article <428d43ba$0$1330$5fc3050@dreader2.news.tiscali.nl>,
> Roderik <mail@roderik.net> wrote:
>
>
>
>
> Yeah, but the info there doesn't work on Safari, Camino, or Opera 7 on
> the Macintosh. The page didn't display very well in IE 5.2. It's
> _really_ broken in iCab, but that's probably because iCab is really
> broken on the Mac.
>
> The form field didn't display on Safari either.
>
> Why do lazy web designers assume that Windows is the _only_ platform?
>

Forms and form elements are merely an OS dependant thing and therefore
they should not be styled. You might have them styled well for now, but
when for example Windows Longhorn with its new IE comes it might look
completely wrong (but most often it is somewhere in between the OS style
and the described style in your code).
If you want it OS independend try to avoid form elements (although I
won't recommend to do so), use a normal image or hypertext link to fire
a javascript that submits (the javascript disabled browsers would have a
problem then, but you might offer them a normal submit button, but that
requires another workaround, bla, bla....).