Open Bug 1293627 Opened 8 years ago Updated 2 years ago

HTML buttons have not the correct size ONLY in Linux 16.04

Categories

(Core :: Widget: Gtk, defect, P4)

Product:
Core
Component:
Widget: Gtk
Version:
48 Branch
Type:
defect

Tracking

()

Status:
REOPENED

People

(Reporter: dismark, Unassigned)

Details

(Whiteboard: tpi:+)

Attachments

(6 files)

2 Firefox after click.png
24.72 KB, image/png
Details
3 Chromium appearance.png
19.40 KB, image/png
Details
4 Firefox on Windows in VirtualBox.png
9.00 KB, image/png
Details
1 Firefox before click.png
23.48 KB, image/png
Details
dismark_site_under_Chrome.png
110.21 KB, image/png
Details
dismark_site_under_Firefox.png
81.20 KB, image/png
Details 
User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:48.0) Gecko/20100101 Firefox/48.0
Build ID: 20160728203720

Steps to reproduce:

Create a script in HTML :
<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	
	<style>
		.bouton:hover {
		background-color: maroon;
		color: yellow;
		}

		#zone_saisie_identifiant {
			margin-left: auto;
			margin-right: auto;
			width : 10%;
			margin-top: 40px;
			padding: 20px;
			background-color: lightblue;
			text-align: center;
			font-family: Arial;
			font-size: 13px;
			font-weight: bold;
			border: 2px black solid;
			border-radius: 10px;
		}
	</style>
</head>

	<div id="zone_saisie_identifiant">
		<input type="submit" class="bouton" value=">" />
		<br /><br />
		<input type="submit" value=">" />
	</div>

</html>


Actual results:

The buttons are too much big ONLY in Linux 16.04 (was correct on Linux 15.10). The script is also correct under Windows version of Firefox.
The script is correct with Chromium under Linux 16.04.
When you click on the button, its size becomes correct, but you must click again to valid the execution of the action of the button.
This problem appears on several versions of Linux16.04 : Kubuntu and Ubuntu have been tested and give the same result.
All the applications written in PHP/HTML are corrupted in their appearance.


Expected results:

In correct use, the button must execute the action that is programmed.
1. Where do you install Firefox from, and which version are you using?
   Is it distro package or Mozilla's build?

2. what's the "action" you mentioned in Expected results?
   the example doesn't do anything when click those buttons
Flags: needinfo?(dismark)
1 - Firefox has been installed from my distribution.
Version : 48.0 "Mozilla Firefox for Ubuntu Canonical 1.0"
All the previous versions have the same problem since Linux 16.04.

2 - The 'action" doesn't exists in my example : I did not want to have a big script.
To see the action, you can use my site : "www.dismark.fr"
When you click on a button, WITHOUT release, the button has his normal size.
I just test on Debian : all is correct
Versions : Debian 8 
Firefox 45.2.0.
The problem seems to be on all Ubuntu releases 16.04
Can you test with Mozilla's build?
If the issue doesn't happen with it, it's Ubuntu's package's issue.
about button size, it would be the same bug as bug 1022325.
I just confirmed the issue on Mozilla's build.

not sure about action's bug, I cannot reproduce it.
I used the Mozilla's build and the problem always exists.
I have several operating systems with VirtualBox and the results of my tests are :
With all Linux 16.04 OS (Kubuntu, Ubuntu, Xubuntu) :
With Firefox 45.0.2 : all is OK
With Firefox 47.0 and Firefox 48.0 the problem appears.
Can you describe more about "action" part?
what's the expected behavior and what's the actual behavior?

    
    

    
  


  

    
    

    
  


  

    
    

    
  
The only inconvenience is the anormal size of the buttons.
                              ============
To illustrate this point, I add 3 images to my previous mail.
"1 Firefox before click.png" is the result when you load my little script (first mail) : the buttons are too big !
"3 Chromium appearance.png" (on Linux 16.04) and "4 Firefox on Windows in VirtualBox.png" are the correct size of the buttons.

The previous image "2 Firefox after click.png" is the result when you click on the upper button WITHOUT release it. Its size becomes normal, but you must click again on the button to execute the action you want (no action in my script, because the PHP code is not written, but this action is always executed).

My test were realized on two different computers : an AMD and an Intel system ; the results are the same.

I have read somewhere on the net (but I don't remember where) that the new release Linux 16.04 don't use the same manner to display graphical informations. (Open-Gl instead of "Direct X" (not sure for the second term ?), and this site explains how to modify the parameters of Firefox. I try to use what was explained, but I don't find the parameters (perhaps it was for Windows version of Firefox).

    
    

    
  
thanks :)

So, there are the following 3 issues, right?
  A. button size is too big
  B. button size changes by clicking
  C. first click doesn't invoke event handler for onclick or something

the issue "B" should be the dupe of bug 1022325, so we could track it there.
"A" would be a part of bug 1022325, as the button's size should be aligned to either before or after clicking

then, I'm not yet able to reproduce "C".
can you provide a testcase?

    
    

    
  
I agree for bug 1022325, and also for your remarks.

The only test case I suggested is to connect to my site "www.dismark.fr"

The correct size of buttons are shown on the attached image "dismark_site_under_Chrome.png".
The "dismark_site_under_Firefox.png" shows the differences.

If your connexion has the good appearance, you can't reproduce the bug.

    
    

    
  


  

    
    

    
  


  

    
    

    
  
sorry, I still don't understand the issue "C" in comment #12.

what actually you mean by "the action you want" in comment #11 ?
how can I reproduce the issue in www.dismark.fr ?
which button should I click and what's the action that should be executed by the button but isn't for first click?

    
    

    
  
"The action you want" means the PHP code written for the button.

This code is executed correctly, when you click and release.
The code is not executed when you click without release.

For resume the bug 1022325 is not complete in its description : 
"This is dependent on the : hover style" : YES, but also the original size is too big !

Do you think it is desirable I add this remark for bug 1022325 ?

Thank you for your help : I had not seen this bug was already notified.

    
    

    
  
1. which button?
2. how the PHP code is invoked from the page?
3. what do you mean with "click without release" ?
   where do you release the mouse button?

    
    

    
  
1 - The buttons are viewed on my site www.dismark.fr
2 - HTML code is invoked with such line : 
"<input type='button' value='Découvrir ...' class='bouton' onclick='location.href="Linux.php" ' />"
3 - "click without release" means you only push the mouse button : the aspect of the button on the page must change as described with the css.style :hover. if you release the mouse no action is then executed.

    
    

    
  
ah, I see.
the size of the button is changed when you push down the mouse button, and the position of your cursor becomes outside of the button, and when you release the mouse button, onclick event isn't fired, right?
If so, this bug is totally a dupe of bug 1022325.

    
    

    
  
I agree.

I am going to follow the response for bug 1022325.

Thank you for your help
Status: UNCONFIRMED → RESOLVED
Closed: 8 years ago
Resolution: --- → DUPLICATE

    
    

    
  
The size _change_ on click is bug 1022325.  But this bug is about the original (native themed) size being too big, no?

Did the OS theme just change from Ubuntu 15.10 to Ubuntu 16.04?

    
    

    
  
oops, I misunderstood that bug 1022325 covers it too.
reopening.
Status: RESOLVED → REOPENED
Ever confirmed: true
Resolution: DUPLICATE → ---

    
    

    
  
And after ... the link you precise : solution is a patch ?
But how can I use this patch ? or it will be added in the future version of Firefox ?
Component: Untriaged → Widget: Gtk
Product: Firefox → Core

    
    

    
  
sorry, forgot to remove needinfo flag.
Flags: needinfo?(dismark)

    
  
Flags: needinfo?(twalker)
Flags: needinfo?(twalker)
Priority: -- → P4
Whiteboard: tpi:+

    
    

    
  
AS the bug is always present in the latest version (49) I use, is possible to obtain Firefox for Linux version 45 (I suppose it hasn't the bug) ?

    
    

    
  
Dismark,  yes, you can find that here: https://ftp.mozilla.org/pub/firefox/releases/45.0.2/

    
    

    
  
Thank you very much, all my PHP∕HTML applications are OK with this version of Firefox.

    
    

    
  
In the last version of Firefox (54.0) the problem is always here.
I hope someone will find the solution, because my only solution is to use Firefox 45.0

    
  
Severity: normal → S3

          You need to log in
          before you can comment on or make changes to this bug.
        






  

    
  







  

    

      
Attachment

      

      
      
      
      
    

    

      

        

          

            
General

            

              Creator: 



            

            
Created: 

            
Updated: 

            
Size: