Updates from August, 2016 Toggle Comment Threads | Keyboard Shortcuts

  • ThomasPowell 1:26 pm on August 17, 2016 Permalink
    Tags: acid3, html5   

    HTML5 support and the latest browsers 

    I got an email update from Microsoft on their upgrading of Bing Rewards to “Microsoft Rewards”, which includes using Microsoft Edge as another way to earn rewards. My first thought was that that wouldn’t be too bad for web developers who use multiple browsers, anyway. But, of course, Edge is quite a bit more advanced than the Internet Explorer versions that people are still using.

    So I was curious how each browser stacked up, and went to html5test to check on current compatibility.

    Browser versions:

    • Chrome Version 51.0.2704.106 (64-bit)
    • Firefox 48.0
    • Safari Version 9.1.2 (10601.7.7)
    • Edge (Okay, I haven’t figured out how to find version info on Edge yet)

    HTML5Test overall scores (all features in categories are given pretty much equal weight)

    • Chrome: 492/555
    • Firefox: 461/555
    • Edge: 433/555
    • Safar: 370/555

    While Firefox looks like number 2 overall, the form elements features in HTML5.

    • Chrome: 64/65, only missing Directory Upload support (no browser listed has it)
    • Edge: 58/65, missing an output element, input type=color.
    • Firefox: 44/65, but missing all the date type inputs, including type=date itself.
    • Safai 39/65<, with similar gaps + datalist element./li>

    I also decided to run all four against Acid3:

    • Safari: 100/100, mostly smooth
    • Edge: 100/100, but pregnant pauses and artifacts in the intermediate stages.
    • Firefox: 99/100, completely smooth until it stopped.
    • Chrome: 97 – 99/100. One artifact in the upper left corner, inconsistent results.

    Conclusion:

    There probably won’t be much benefit in using Edge as far as uncovering problems traditionally associated with IE, but it is yet another browser that behaves “differently”, yet not nearly as frustrating as old Microsoft browsers.

     
  • ThomasPowell 11:22 pm on July 27, 2015 Permalink
    Tags: ,   

    Bootstrap 3 radio-inline and checkbox-inline elements running together. 

    I was having issues with Bootstrap 3 radio buttons running together even though the labels had a “radio-inline” attribute.

    After examining the layout of the html being generated, I realized that each individual label and radio button was being wrapped in its own containing element (in this case, a “td” element.)

    The reason for this is the following CSS:

    .radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline {
      margin-top: 0;
      margin-left: 10px;
    }
    

    If the .radio-inline elements aren’t adjacent to each other, the ‘margin-left’ value will not trigger.

    Unfortunately, it took a little too long to track down the source of the issue, but now I know.

     
  • ThomasPowell 12:51 pm on December 18, 2014 Permalink
    Tags: chrome   

    Sites That Have a Problem Working in Google Chrome 

    I’ve been hitting issues with site compatibility with Chrome lately, so I decided to start with a list of sites that I’ve had issues with in the last day, and I’ll build on from there.

    As of Chrome 39.0.2171.71 (64-bit) on Yosemite:

    • panel.dreamhost.com – Rebilling edit does not allow you to check the checkbox to limit billing on one day or specify an amount. (Only happened when my recurring was expired. Cannot reproduce now.)
    • Fidelity.com – Quicklinks dropdown after login collapses immediately instead of allowing you to select a menu item.
    • playstation.com – Password Reset password fields don’t register that you’re typing in any information (strength meter doesn’t change), and when you submit, you password hasn’t actually been changed. Same functionality worked in Firefox.
    • GWT Developer Plugin installed but not recognized.
     
c
Compose new post
j
Next post/Next comment
k
Previous post/Previous comment
r
Reply
e
Edit
o
Show/Hide comments
t
Go to top
l
Go to login
h
Show/Hide help
shift + esc
Cancel
%d bloggers like this: