Two Front End Development Interview Questions No One Has Been Getting Recently + One I’m Afraid to Even Ask

by Rob Larsen

Yes, I’m still helping out with screening candidates. I haven’t yet interviewed someone to replace me, but there’s still a week to go.

Anyway, we’ve had a couple of technical questions that candidates universally failed to answer. Why share them here? For starters I just want to know if we’re crazy to expect people to know these. I also like the idea of a kind of “easter egg” for candidates. If someone does enough research to find my blog and read this post, they’ve shown me something, even if it’s not the answer to one of the questions posed below.

The two that have surprisingly turned into stumpers (at least for the last five or six folks I’ve interviewed)

  1. What is hasLayout?
  2. What’s the significance of setting the body text to .625em?

And the bonus question that I want to ask, but don’t, because it’s kind of goofy to say out loud

  1. What’s “The Mark of the Web?”

Answers after the jump.
Read the rest of this entry »

Rethinking the “How To Serve IE-Specific CSS” Question

by Rob Larsen

This is my old pattern:

<!DOCTYPE html>
  <html lang="en-US">
	<title>Internet Exploder</title>
        <link rel="stylesheet" href="/_assets/styles/styles.css" />
	<!--[if gte IE 5.5]>
		<![if lt IE 7]>
			<link rel="stylesheet" href="/_assets/styles/ie6.css" />
	  	<![endif]>
	  	<![if IE 7]>
	  		<link rel="stylesheet" href="/_assets/styles/ie7.css" />
	  	<![endif]>
      <![if gt IE 7]>
			<link rel="stylesheet" href="/_assets/styles/ie8.css" />
	  	<![endif]>
  	<![endif]-->
</head>
<body id="home">  

Simple. It serves a new style sheet to various versions of IE as needed. The bad thing is the extra HTTP request added onto the Microsoft browsers. I’m not even there yet, but during one of my interviews for the new gig an alternative was suggested- using conditional comments to append a different class to the html element and letting the cascade sort it out.

I liked that idea.
Read the rest of this entry »

Microsoft’s CSS Filters, Could The Syntax Be Any Uglier?

by Rob Larsen

The answer is no :)

While some of the functionality of MS’s CSS filters is actually pretty useful (sue me, I need to use them from time to time), the implementation is ugly as hell. Ryan, one of the smart guys here that helps me fool people into thinking I know what I’m doing, had to implement the Microsoft gradient filter as a (brilliant) hack for a performance issue on a small subset of IE browsers. We were discussing the solution and then he called up the code.
Read the rest of this entry »

I, For One, Welcome Our New CSS3 Overlords. As Long As They Bring box-sizing With Them.

by Rob Larsen

I’ve always preferred the “IE Box model.” I’ve always wanted width to actually be the width of the element. Instead, I’ve been forced, for years, to break out my math skills to calculate “actual” value of the width property by subtracting padding, margin and borders. That still seems broken to me after all these years.

I’m not alone in this. Here are some big shots sharing their thoughts on the matter:
Read the rest of this entry »

I Love You, border-radius. You Too, box-shadow. No, I Didn’t Forget About You, rgba Color!

by Rob Larsen

As I’ve mentioned I’m doing a couple of HTML5 implementations and in one of them I was faced with some “post” boxes in a WordPress theme that featured both rounded corners and a drop shadow. Since I’m using already using Modernizr, which exposes specific CSS3/HTML5 feature support on the HTML element, I figured I’d do a little bit of extra work and use some CSS3 magic to make the design happen in modern browsers. For this post I’ll skip the extra work bit (a little JavaScript to insert extra markup in for Internet Explorer/Opera) and just look at the implementation for fancy new browsers (Firefox 3.5 and the latest/greatest Webkit based browsers.)

First, let’s look at it in action (this will suck in IE/Opera)
Read the rest of this entry »

Fun With the :Hover Pseudo Class and Code Samples

by Rob Larsen

This being a technology blog, with plenty of code samples being posted on a regular basis, it’s no surprise I give soem thought as to how that code is displayed. Personally I’ve gone for the old school, green on black text (using the excellent code font Consolas, where possible.) I like the way it looks.

function heckYeah() {
    check.it.out();
}

The one problem is with really long lines. Since I use a lot of real world examples and it’s code I’m caught between a desire to have one line of code=one line on the screen (easier to scan) and the readability issues that a scrolling text box creates.
Read the rest of this entry »

Some Internet Explorer Innovations You Probably Forgot About While Waiting for IE6 To Die

by Rob Larsen

Lost in the past few years of IE6 based stagnation (and ensuing developer angst) is the fact that the Internet Explorer team have come up with some pretty cool enhancements to the way we build web sites over the past ten plus years.

So, while we’re cheering on Firefox’s growing market share, hesitantly eying IE8 and waiting for the ugly stepchild of the browser landscape, IE6, to finally die a painful (and hopefully immediate) death, I thought I’d lay out some of the innovations introduced by Internet Explorer to remind us of relatively positive days gone by*.

As a fun exercise, while you’re reading this, compare these innovations to the black hole left in the web development world by the long and terrible reign of IE6. It’s an interesting juxtaposition of help vs. harm. Here’s hoping future versions of the browser continue to trend closer to the “help” line as IE7 has and IE8 appears to be doing**
Read the rest of this entry »

Using overflow:auto to Clear Floated Content in CSS

by Rob Larsen

For a long time, I used something like <div style="clear:both"></div> or its class equivalent to clear floated content in layouts. I knew, at some level, there were better solutions, but as these things go- I had deadlines to meet, had a working solution and there was never any inducement to look for a new one. Sure, there was a little extra markup, but it was so limited I could live with it.
Read the rest of this entry »