• Organizing Wordcamp Twin Cities 2009
• Converting rocking HTML Designs into rocking WordPress Templates
• WordPress Overview for Beginners
• WordPress as a CMS

Details:

http://www.youtube.com/watch?v=vcXUrNSvjhU

It’s a presentation of the Prince software which is intended to allow one to create print layouts (PDF output) using HTML and CSS3.

What’s impressive is that this is basically a browser that actually fully supports CSS3 properly…which is hard (impossible?) to find these days within the current crop of web browser.

Will it replace InDesign and XPress? Not anytime soon, but it sure is an impressive demo of what CSS can do when it’s fully supported by the rendering engine.

Type:

St. Paul…er…New Hope…er…UK based Process Type Foundry (Eric Olson) has a new typeface out called Seravek.

Portugal Based DSType Foundry (Dino dos Santos) is having a half-off summer sale. Dino has some great faces that are already affordably priced. Half off is going to make it hard not to resist purchasing a few of these…

Architecture:

Building Minnesota is a MN-centric architecture blog written by Todd Melby that I came across via the AIA MN’s Blog.

Shopping:

Have you been through Target all summer eying that nice looking modern plywood toddler two-wheeler for $50 for your 3 year old? It went on sale last week for $25. Go grab one. Link? For some inexplicable reason, Target isn’t selling their own Target branded outdoor toys online.

CSS grid-based layout frameworks:

At work here, we recently had a consulting firm deliver us a prototype for a new intranet. They built the site using pure CSS-P which is great, and then I noticed that they decided to use the Yahoo CSS framework. We have the daunting task of somehow getting this inside of SharePoint, which may or may not work as-is, but I am going to be interested in how easy it is to work with Yahoo’s prebuilt CSS framework. Seems that the biggest complaint about them is a lack of semantic labeling, which is to be expected if the framework is to work as a generic platform. Blueprint is another grid-based CSS framework that has been making the rounds this week which is also being compared to the aptly named Yet Another Multicolumn Layout CSS framework. I hope to take a closer look at these options soon. If you’ve used them, please share your thoughts.

If you managed to miss this somehow:

http://www.adobe.com/creativelicense/

Go ahead and Preorder today, but I don’t think they’ve made any promises about when it will actually arrive yet. I’d hope it will show up before Flashbelt.

They have gone as far as telling me my plan to upgrade a copy of Flash 5 that I bought off a guy for $40 on Craigslist and planned to upgrade to Flash CS3 will not work.

Personally I’m most intrigued by a new flash feature that attempts to make the designer to developer workflow easier by allowing us to export tweened animation in Flash as Actionscript code…

A project a while back had me interviewing women about the web resources they used during their pregnancy. As you probably can expect, they all spoke very highly of BabyCenter.com.

Normally, I don’t visit big name sites like this, their high saturation of ads and less than intimate writing keep me away. That being said, I found myself directed to a BabyCenter url this morning.

The above screenshot met me when I got there. If you can tell, the article I went there for is behind the ‘Parents Picks’.

There’s no way to close it, resizing the browser only makes it wider. Best I can figure, it’s supposed to be the left-hand column. I was able to see the text by reloading the browser and stopping the page before this obnoxious portion of the page loaded.

We’re far too deep into this internet thing, and IE is too much a security risk, for me to switch browsers on a per website basis.

The primary requirement is CSS/XHTML/JS expertise.
The secondary requirement is experience with LAMP aligned server-side programming skills.

If you or someone you know is interested, pass an email along

While on Circuit City’s site looking for prices and products I was a little baffled at their product detail layout:

Given the tight margins and cut-throat competition in their market, I thought putting the product image and price at the bottom of the page was a bold move.

Darrel had no idea what I was talking about – cause it looks as expected in Firefox.

Now I’m not sure how many other people are primarily using Safari (let’s see, Mac sales are up, Mac IE doesn’t exist, Safari ships with Mac), but I’m sure it’s increasing and I know CC lost at least one sale because of the screwed up CSS.

The Web Developer Tool bar in Firefox has a nice ‘outline divs’ option, but it still competes with the visuals on the page. So, I whipped up this quick user style sheet that kills all div styles and gives them all a unique border.

To use it, just cut and past the CSS below into a file and save it. Then, via the Web Developer Toolbar, you can go the the CSS menu and select ADD USER STYLESHEET and you’ll then have a nicely outlined ‘map’ of all your divs.


body {
background-color: #fff !important;
}

span {
border: 2px solid pink !important;
padding: 5px !important;
margin: 5px !important;
min-height: 3px !important;
}


Not the prettiest of solutions, but thought I’d share it. There may very well be a better solution out there in the form of a FireFox extensions. If you know of any, let me know!

UPDATE:

Per Bill’s suggestion, I decided to make this a bookmarklet. To use this, drag the link below to your toolbar. Then, take the above CSS and place it into a file called ‘outlineDivs.css’ and place it somewhere on your computer. You’ll need to edit the javascript to then point at that file. (by default, the script looks at ‘http://localhost/utilities/outlineDivs.css’)

Outline Divs Bookmarklet

UPDATE II:

I went ahead and made a self contained bookmarklet as well. The advantage is that you don’t need your own CSS file on your hard drive. The drawback is that it’s a bit more of a pain to edit the CSS if you want to tweak it yourself. Enjoy.

Self Contained Show Divs Bookmarklet

The problem is designing a site with CSS rollovers and finding that, when viewed in IE/PC, any hover of a link will cause the page to jump a few pixels to the left.

The culprit as it turns out, is due to my method of adding visual margins to my page:


body {
padding: 0% 3%;
margin: 0px;
}


The logic (in my head) being that since padding is applied*inside* the box, then naturally one should use that to give the edges of your page some white space.

Well, even though this works fine in Mozilla, this will trigger the ‘page jump’ on hover issue with IE. The solution? Simply reverse padding and margin:


body {
padding: 0px;
margin: 0% 3%;
}


Same visual result without the annoying IE problem.