difference between input/a with same style

i've applied the same style to A and INPUT but got different results.
when i apply this style:
--------------------
..mytest {
font-size:11px; font-family:arial; line-height:11px; text-
decoration:none;
background-color:#ccc; color:#000; border:0;
margin:0; padding:0; display:inline;
}
--------------------

to:
--------------------
<a href="#" class="mytest">test</a>
<input type="submit" class="mytest" value="test" />
--------------------

i get different results. in firebug INPUT occupies 24x15px space and A
18x13px.
any tips on what i'm missing?

Aljosa Mohorovic

On 2009-11-04, Aljosa Mohorovic wrote:

i've applied the same style to A and INPUT but got different results.
when i apply this style:
--------------------
.mytest {
font-size:11px; font-family:arial; line-height:11px; text-
decoration:none;
background-color:#ccc; color:#000; border:0;
margin:0; padding:0; display:inline;
}
--------------------

to:
--------------------
a href="#" class="mytest">test</a
input type="submit" class="mytest" value="test" /
--------------------

i get different results. in firebug INPUT occupies 24x15px space and A
18x13px.

And on someone else's browser, it will be different again.

You have specified a font size that is too small for me to read, so
my browser will use a default (I think it's currently 18px). Since
you have set a line-height of 11 px, whatever I enter will be cut
off and unreadable.

any tips on what i'm missing?

The fact that you *cannot* specify exactly what a page will look
like in someone else's browser (or even, apparently, in all of your
own browsers).

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)

In article <7lejptF3boe1aU1 (AT) mid (DOT) individual.net>,
"Chris F.A. Johnson" <cfajohnson (AT) gmail (DOT) com> wrote:

On 2009-11-04, Aljosa Mohorovic wrote:
i've applied the same style to A and INPUT but got different results.
when i apply this style:
--------------------
.mytest {
font-size:11px; font-family:arial; line-height:11px; text-
decoration:none;
background-color:#ccc; color:#000; border:0;
margin:0; padding:0; display:inline;
}
--------------------

to:
--------------------
a href="#" class="mytest">test</a
input type="submit" class="mytest" value="test" /
--------------------

i get different results. in firebug INPUT occupies 24x15px space and A
18x13px.

And on someone else's browser, it will be different again.

You have specified a font size that is too small for me to read, so
my browser will use a default (I think it's currently 18px). Since
you have set a line-height of 11 px, whatever I enter will be cut
off and unreadable.

any tips on what i'm missing?

The fact that you *cannot* specify exactly what a page will look
like in someone else's browser (or even, apparently, in all of your
own browsers).

OP might get closer to what is wanted, taking into account what Chris
says, by adding an explicit font-size: 1em; or thereabouts to the above
class's styles.

--
dorayme

On 11/04/09 04:23 pm, Aljosa Mohorovic wrote:

a href="#" class="mytest">test</a
input type="submit" class="mytest" value="test" /

i get different results. in firebug INPUT occupies 24x15px space and A
18x13px.
any tips on what i'm missing?

Besides an URL to a test case?

As others have noted, that is a ridiculously small font size and line
height. You actually expect people to read it?
Out of curiosity, why are your using XHTML?

The submit element is a button with the extra decoration; the link
element is only text. The amount of extra decoration depends on the
browser, the browser's current theme (or "skin"), and the OS.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

In article <doraymeRidThis-7071BB.11310405112009 (AT) news (DOT) albasani.net>,
dorayme <doraymeRidThis (AT) optusnet (DOT) com.au> wrote:

In article <7lejptF3boe1aU1 (AT) mid (DOT) individual.net>,
"Chris F.A. Johnson" <cfajohnson (AT) gmail (DOT) com> wrote:

On 2009-11-04, Aljosa Mohorovic wrote:
i've applied the same style to A and INPUT but got different results.
when i apply this style:
--------------------
.mytest {
font-size:11px; font-family:arial; line-height:11px; text-
decoration:none;
background-color:#ccc; color:#000; border:0;
margin:0; padding:0; display:inline;
}
--------------------

to:
--------------------
a href="#" class="mytest">test</a
input type="submit" class="mytest" value="test" /
--------------------

i get different results. in firebug INPUT occupies 24x15px space and A
18x13px.

And on someone else's browser, it will be different again.

You have specified a font size that is too small for me to read, so
my browser will use a default (I think it's currently 18px). Since
you have set a line-height of 11 px, whatever I enter will be cut
off and unreadable.

any tips on what i'm missing?

The fact that you *cannot* specify exactly what a page will look
like in someone else's browser (or even, apparently, in all of your
own browsers).

OP might get closer to what is wanted, taking into account what Chris
says, by adding an explicit font-size: 1em; or thereabouts to the above
class's styles.

And setting the line-height to a ratio instead of a pixel value.
(What is this, meme-of-the-week time?)

On Nov 5, 6:22 am, Jim Moe <jmm-list.AXSPA... (AT) sohnen-moe (DOT) com> wrote:

Besides an URL to a test case?

updated version at: http://67.23.27.235/buttons/

As others have noted, that is a ridiculously small font size and line
height. You actually expect people to read it?

this is example code, not something that i expect people to read.
font-size/line-height can be changed, my goal was to get the same
effect (or the best i can get) across browsers.

Out of curiosity, why are your using XHTML?

no special reason.

The submit element is a button with the extra decoration; the link
element is only text. The amount of extra decoration depends on the
browser, the browser's current theme (or "skin"), and the OS.

i understand that i can't get pixel-perfect style applied to a/input
tags but i'm sure i can get some advices how to improve my current
style.

Aljosa Mohorovic

On Nov 5, 1:15 am, "Chris F.A. Johnson" <cfajohn... (AT) gmail (DOT) com> wrote:

any tips on what i'm missing?

The fact that you *cannot* specify exactly what a page will look
like in someone else's browser (or even, apparently, in all of your
own browsers).

would your advice be for me to find a different newsgroup to ask
stupid questions with users more tolerant to new users or is it just
an impolite way to point that my post could have been better prepared
with more details?

Aljosa Mohorovic

Aljosa Mohorovic schrieb:

On Nov 5, 1:15 am, "Chris F.A. Johnson" <cfajohn... (AT) gmail (DOT) com> wrote:
any tips on what i'm missing?
The fact that you *cannot* specify exactly what a page will look
like in someone else's browser (or even, apparently, in all of your
own browsers).

would your advice be for me to find a different newsgroup to ask
stupid questions with users more tolerant to new users or is it just
an impolite way to point that my post could have been better prepared
with more details?

None of the above. Other people are seeing your web page in a browser
that they have configured to *their* liking. They might prevent your
page from using its fonts, insisting on something like a 36 point Times.
To summarize: "you *cannot* specify exactly what a page will look like
in someone else's browser".

In article <no.email-B6F4B1.08210205112009 (AT) news1 (DOT) chem.utoronto.ca>,
David Stone <no.email (AT) domain (DOT) invalid> wrote:

OP might get closer to what is wanted, taking into account what Chris
says, by adding an explicit font-size: 1em; or thereabouts to the above
class's styles.

And setting the line-height to a ratio instead of a pixel value.
(What is this, meme-of-the-week time?)

Oops... yes, my fingers didn't know when to stop! I doubt it mattered
much in this case. Note, it is not wrong to use a unit, just a tad
dangerous in situations where, for example, the line height is set on a
container that has descendants with different font sizes.

(Sport is to go meme busting every now and then but I was not meaning to
on this occasion <g>)

--
dorayme