Crafting the Front-end.
Genius. Every front-end developer needs to read this (click the title above).
Screen Zoom in Mac OSX Lion
I needed to utilize screen zoom today on my Mac but couldn’t find it. After much searching, I discovered that the screen zoom settings are located in a different place on Lion. I was also surprised to discover the functionality has changed drastically. You can find the new settings here (play around with the various options):
System Preferences > Universal Access > Seeing > Zoom in window > Options
Then, be sure to check the box that reads: “Use scroll wheel with modifier keys to zoom”
Getting True Height with jQuery
I’ve come across this issue multiple times when trying to get the height of a content area (that contains images) using Javascript. In Webkit browsers (like Safari & Chrome), the height you retrieve will be minus any image heights, therefore not a true height. The reason for this is the order in which webkit loads images. The simple solution to this issue is to make your call using window.load instead of document.ready, like this:
$(window).load(function(){
var elementHght = $('#content').height();
});
(Source: stackoverflow.com)
Safari Address Bar Shortcut
For some reason, Safari on my new iMac at work doesn’t initially focus on the address bar. As a work-around, I’m using the keyboard shortcut which is: Command + L (in case anyone else wanted to know).
"Rseaerch icntidaes taht the oerdr of the ltteers in a wrod dnsoe’t relaly mettar. Waht relaly mtteras is the frist and lsat leettr in the wrod. If tehy are in the rhgit palce, you can raed the wdors."
Came across this today while reading an incredible article about branding, entitled “Branding Is About Creating Patterns, Not Repeating Messages”
Check it out: http://goo.gl/GO9LG
(Source: fastcodesign.com)
Target Webkit (Safari and Chrome) Browsers Only.
A few weeks ago I wrote a post about how to target Firefox in your CSS. Today I had an unusual issue that was appearing on Webkit browsers only and needed a quick fix. I came across a smart way of doing just that using a media query. Here you go:
@media screen and (-webkit-min-device-pixel-ratio:0) {
/*webkit only CSS goes here*/
}
I found this code on the website: CSS, Javascript, and XHTML Explained.








