161708 - Text is not centered in buttons

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[Mehdi Rahman]

From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.0.0) Gecko/20020530
BuildID:    2002053012

In the red buttons, the text is not centered. In ie 6.0, the text is centered in
the buttons.

Reproducible: Always
Steps to Reproduce:
1. Go on the site
2. See the result
3.

Actual Results:  Text is not centered

Expected Results:  The text should be centered (see in ie 6.0)

Comment 1

[Ian Neal]

Something to do with Style Sheets?

Comment 2

[Sam J. Fleet]

Here's the clipping of the style sheet I looked up in the file
"shinghitai_general.css".  

--clip--
input.buttonRed
{
	margin: 0;
	border: 0;
	padding: 0;
	color: #f0f0f0;
	background-color: #f0f0f0;
	background-image:url("../bin/button_shape.gif");
	background-position: center;
	background-repeat: no-repeat;
	width: 110px;
	height: 35px;
	cursor: pointer;
}
--clip--

The two buttons you saw on the website use this style sheet script.  The image
file of the red button is found at
"http://www.lifestills.net/~shinghitai/web/bin/button_shape.gif".  This showed
the button itself is just a red button with no text.  Although the description
of the style sheet, "buttonRed" seem odd.  The html button code have the value
that cause the button to spit out the text on the top of the red button image,
although not use what is left with the default grey html button image.

The style sheet correctly centered the text on the button.  I'm not aware of the
style sheet, "background-xxxxxx" that would valign the button images.  Perhap
someone will fill in for me.

Comment 3

[Sam J. Fleet]

--clip--
<tr>
 <td class="Data Center">
  <input class="ButtonRed" type="submit" value="Valider"> 
  <input class="ButtonRed" type="reset" value="Réinitialiser">
 </td>
</tr>
--clip--

The web programmer didn't use the "valign='center'" within the <td> script so
that would explain why the text and the button looked funny.  It should be like
this.  Not sure about the images though.

--clip--
<tr>
 <td class="Data Center" valign='center'>
  <input class="ButtonRed" type="submit" value="Valider"> 
  <input class="ButtonRed" type="reset" value="Réinitialiser">
 </td>
</tr>
--clip--

Comment 4

[Ian Neal]

Using BuildID 2002091508 on Win2KSP2, it looks like either the site has been
fixed or something in mozilla, marking as WFM. Reporter reopen if there is still
a problem stating which recent buildid you are using.