Welcome to the newly improved Browser Watch, fetching a brand new custom created WordPress theme.
We hope the updated design will make it easier for our users to read the news without the pages being too cluttered.
The design itself relies heavily on CSS3 features, such as border-radius, box-shadow, text-shadow the CSS gradients, so Internet Explorer users, and to a degree Opera users (with it’s lack of CSS gradient support) will miss out on the full effect, though the site is fully functional in both browsers.
It’s still a work in progress, with a few features missing (such as the search box), but it’s mostly all there. Let us know if you spot any bugs, have any suggestions or comments.
7Red wrote on March 31, 2010 at 5:10 am
Hey, what’s up with the prefixes in the style sheet? This looks like shit in any browser that’s not Firefox or Chrome…
Alex wrote on March 31, 2010 at 8:22 am
Hi 7Red,
What browser are you using? I am well aware that some of the elements of this design will not work in all browsers. Generally our users are all up to date with modern browsers.
Firefox, Chrome and Safari make up about 70% of visitors, so they will get the full effect.
It’s really only Internet Explorer and Opera users that miss out, and I am happy with the compromise that these browser falls back too – sure it’s not as pretty but it works and is still nice and clean.
7Red wrote on April 1, 2010 at 2:46 am
Hey, Alex!
Nice to actually get a response. Even though I am using the latest build of Opera 10.5 I can’t see any border-radius, text-shadow, or box-shadow! I’m sure you are well aware of the fact that Opera supports all these CSS3 features, apart from CSS Gradients.
I took a peak in your style sheet, and I noticed you only have used prefixed CSS3 code! When you are using -moz- and -webkit- the code will be ignored by every other browser! You should include the standard compliant code as well as the prefixed one to ensure all browsers that are able to use CSS3 features will render the page correctly!
This is very disappointing, considering that this website is all about browsers…
Alex wrote on April 1, 2010 at 10:04 am
Hi 7Red,
On looking into this further, Opera 10.5x only supports the border-radius and box-shadow properties. There is no support for text-shadow like I had originally thought. I have fixed the CSS3 properties to include the standard complaint tags. This should change the design slightly for Opera 10.5x Windows users.
Interestingly, these CSS3 properties do not work with Opera 10.5x on Mac, and I am guessing will also not working with Linux. They appear to be Windows only at this stage, which is disappointing.
If Opera supported all CSS3 properties used on this site it would look like this; http://img.whirltools.com/i/screensfs.png, which is what Firefox, Chrome, and Safari users see.
7Red wrote on April 3, 2010 at 12:42 am
Opera supports box-shadow and text-shadow on Windows at least. I don’t know about the Mac and Linux versions, but I guess they haven’t added the functionality yet, since none of them are officially finished.