Being Amber Rhea

Here’s something I learned today.

Outlook Web Access does not like CSS background images - even though Outlook and Outlook Express do. (Unfortunately, OWA isn’t listed in Campaign Monitor’s Guide to CSS Support in Email). Furthermore, if you use the shorthand background notation and happen to have a background image in there, OWA won’t display any of your background properties. So, this…

background: #6461b6 url("images/sky.jpg") no-repeat top left;

…means that in OWA, your background color won’t be applied - which can be a problem if you’ve also specified white text.

On the other hand, if you do this…

background-color: #6461b6;
background-image: url("images/sky.jpg");
background-repeat: no-repeat;
background-position: top left;

…your background color will be there in OWA. But the image just ain’t going to show up no matter what, so get over it, buddy.

Yes, I know there is a problem with anchor links (e.g., when you click on the recent comments in the sidebar). You end up seeing only that comment, and not the post or any of the other comments. This is a side effect of using the otherwise kickass One True Layout. I must say I was a bit surprised to see this problem show up; I had thought it was an issue only with named anchors (e.g., <a name="whatever">), but apparently it’s also an issue with referring to IDs. And now that I think about it, that makes sense; why would it be an issue with named anchors but not IDs?

Anyway, it’s frustrating; I’ll let you know when I find a fix. I am not going to ditch the One True Layout, that’s for sure!

Update: I have a temporary solution to this problem. It involves reverting to named anchors instead of IDs on divs, and giving each anchor position: absolute (If you’re really curious, you can view the source). I’ll need to put in some hacks for IE, but then there’s a lot I need to do for IE, hence the current no-stylesheet version. And I also don’t know yet how this behaves in Safari or Opera.

It’s mid-afternoon, and already I’ve put up two serious blog posts, and had a bit of an anxiety attack. (These two things may or may not be related; discuss. No, on second thought, don’t.) So how about a little geek humor? Let’s try to lighten the mood.

From “Levels of HTML Knowledge” at 456 Berea Street:

Level 5 people tend to get into endless discussions about tiny markup details. They can waste hours thinking about class names or reorganising their HTML and CSS files to make their code look pretty.

Yup. That pretty much describes me to a tee (tea? T?). Hey, I just like to be organized… my easily-readable stylesheets appease my J-preference!

I’m used to dealing with incorrect CSS rendering, lackluster AJAX support, memory leaks, and all the rest of it in IE. But the other day I came across something new and baffling - and it’s not an IE problem, so it was a huge Whiskey-Tango-Foxtrot* moment.

The problem: In Safari (2.0.3), nothing within the <form> … </form> tags was showing up. But if I removed the opening <form> tag, the inputs, labels, etc. showed up as expected!

After much head-scratching, fruitless Googling, and futzing with HTML and CSS, I found the fix: the form was inside a div, and when I applied display: block to the containing div, all the form elements showed up correctly!

I guess that’ll be one more for the Quirksmode list of Safari bugs!

Update: This happens only if the containing div has the clearfix class applied.

* h/t Rusty

Here it is, folks: the query that, in a little over a week, will bring you - in stereotypically solipsistic manner - the Top 10 Being Amber Rhea Posts of 2005 (based on number of comments).

SELECT logentries.id, title, dt, COUNT( entryid ) AS numComments FROM logentries, comments WHERE YEAR( dt ) = '2005' AND logentries.id = comments.entryid GROUP BY entryid ORDER BY numComments DESC LIMIT 10

This query kind of gives me wood, but not as much as this one.

Finally, it’s all in one place: MaxDesign presents the Basic Web Standards Workshop. This should be a must-read for anyone daring to dabble in web development. It actually goes far beyond the basics, into detailing such intricacies as the debate over heading levels and specific CSS2 bugs in IE. It makes me salivate. (Note: part 3 is my favorite.)

SELECT COUNT(*), a.id, a.title, c.user, MAX(b.timestamp) FROM logentries a, comments b, authent c WHERE a.id = b.entryid AND a.user_id = c.id GROUP BY 2 ORDER BY 5 DESC LIMIT $index_display_number;

This query kind of turns me on.

Anybody who’s good with the AppleScript skillz… email me. I have an idea. (Yes, it’s a secret.)

I finally got around to fixing - er, hacking - my stylesheet, so my layout displays correctly in IE. It actually didn’t take that long to do, which was a pleasant surprise. Just had to add some Tan Hack stuff to body and #sidebar, and a clearing div after the comments and category links in .blogEntry.

If you’re using IE (why, why??) and it still looks funky to you, try emptying your cache.

As I currently don’t have access to a working Mac (yes, I’m blogging from work - gasp!) I don’t know what it looks like in Safari, but I’m sure it’s fine. IE/Mac… well, that’s another story altogether.

Since I’ve been down with OPC (”other people’s CSS”) all day, I figured I’d take a quick break to do a post about my anal-retentiveness; also known as, “This is how I like my CSS and you better recognize, beeotch!”

The way I like stylesheets to be set up is very specific. Let’s look at an example, shall we?

A few things to note:

• CSS properties are in alphabetical order.
• There is one space after the semi-colon for each property.
• Each property is on its on line.
  • If the selector contains only one declaration, then the rule is on one line.
    • When the rule is on one line, there’s a space before and after the declaration.
  • If the selector contains two or more declarations, then it’s broken up onto multiple lines.
    • When the rule spans multiple lines, the selector is on top, with opening bracket; then all the declarations, indented by one space; then the closing bracket on the last line.
• I ♥ shorthand, inheritence, and group selectors.
• If the value (of a margin, for example) is zero, then I don’t bother putting a unit, because it doesn’t matter.
• I try to group together styles that kind of “go together” (all the h2.title styles, for example), and when I’m done with a “group”, I put one blank line before moving on.

Anal-retentive coders, unite!

Jeff Moore has consolidated some of the articles out there comparing PHP and ASP. This debate is getting almost as heated as the perennial “Mac vs. PC” debate, or the even nerdier “vi vs. emacs” debate. I think you all know where I stand on this, so I won’t start pontificating.

I fixed the timestamp issue.

Actually, Chris is a genius, for contributing the code which I had to modify only slightly.

Here’s the magic line:

$theTime = date("Y-m-d")." ".(date("H")+3).date(":i").date(":s");

Sweet. Cross that off the list! Next up: answer emails…

Ok, so, to set the time 3 hours in the future, I think I have to use the mktime() function… which, for some reason, seems more confusing than it should be. I probably pass date("h")+3 as one of the arguments, right?

Anybody have a clue?

Sniffing user agents for Mac IE and writing conditional Javascript with 5 gajillion methods make Amber something something…

This is a new one. It crept up and bit me in the ass today:

Internet Explorer 6 has a puzzling bug involving multiple floated elements; text characters from the last of the floated elements are sometimes duplicated below the last float. This bug is a real headbanger because there seems to be nothing triggering it. However, by now everyone should know that IE needs no excuse to misbehave.

The direct cause is nothing more than ordinary HTML comments, such as, <!– end left column –>, sandwiched between floats that come in sequence. Apparently, the comments are hard for IE to digest when they occupy those positions, resulting in a kind of “screen diarrhea”.

IE never ceases to find new and creative ways to fux0r nice, clean, standards-compliant code!

Unkymoods, the site where I get my cute li’l mood icons, has converted from ASP to PHP. The site as a whole is now much faster, there are more features, and there is a non-Javascript option for placing the icon on one’s site (so it’s not going to be slowing down my site anymore). I think this is very cool. Friendster, of course, converted from JSP to PHP several months ago, and the speed improvement is phenomenal. I used to never want to use Friendster because it was soooo agonizingly slow. Now it’s downright zippy!

Even though they’re [usually] faster than client-side scripting, not all server-side languages are created equal!

From InfoWorld article: “The top 20 IT mistakes to avoid“:

IT managers who look only as far as J2EE and .Net when developing scalable Web apps are making a mistake by not taking a second look at scripting languages — particularly PHP. This scripting language has been around for a decade now, and millions of Yahoo pages are served by PHP each day.

…

The stateless “shared-nothing” architecture of PHP means that each request is handled independently of all others, and simple horizontal scaling means adding more boxes. Any bottlenecks are limited to scaling a back-end database. Languages such as PHP might not be the right solution for everyone, but pre-emptively pushing scripting languages aside when there are proven scalability successes is a mistake.

Oh yeah, if you didn’t know… Yahoo uses PHP. A billion page requests per day, beeatch!

HTML tip: it is possible to have colored bullets in a list without using an image. Unfortunately, you have to use the <p> tag within each <li> item, which seems a little kludgy, but it could be worse.

The CSS:

ul { color: red; }
ul p { color: black; margin: 0; }

The HTML:

<ul>
<li> <p> List Item 1 </p> </li>
<li> <p> List Item 1 </p> </li>
</ul>

How it looks:

• List Item 1

• List Item 2

Of course, use whatever margins, etc. you prefer.

My new favorite thing (as of about an hour ago): PHP Function Index for Mac OS X. Very cool!

I’m calling my blogware (ugh) “A Simple Blog”. ‘Cause that’s what I want it to be.

Latest issues: 1) For some reason, Edit Post is no longer working! WTF? 2) When you post a comment, if the main page has been scrolled down at all, it jumps back up to the top when the comment is posted. I think it might have to do with the use of header().

I’ll be devoting a good portion of this weekend to working on it. Today I think I’ll put up a “changelog” page, if I have time.

Drumroll… I think version .00001 of the blog software is finally ready to be released. I have 4 things left on my to-do list, but there’s no reason why they can’t be qualifiers for a later version. So, over the next few days, as I have the time, I’m going to write some quick-and-dirty documentation, and then let’s get a few beta blogs up and running! Email me, comrades!

With luck, version .0001 beta will be ready for release (ha, that makes it sound so official) within 3 weeks. I’ll get that meta-blog up soon, I promise (unless I decide not to). Off to bed now…