Hey, I'm in CPAN...
....and I didn’t even know it!
A few weeks ago I helped Gozer with some CSS to style some error_log output in a web page in a not-completely-ugly sort of way.
Well! He’s gone and released the module on CPAN and given me credit for the artwork.
Thanks Gozer!
Presenting: XULApps.Net
After reading David Boswell’s post on Finding XUL Applications in which he laments the lack of a central repository for links to XUL applications, I decided to jump in and create XULApps.Net
I put in a bunch of XUL applications, but I know that there are more out there.
If you have created or know of an XUL application, reference site, or blog that isn’t in the directory, you’re welcome to visit the site and add it to the appropriate category.
Get a div to expand around floated content
Floated elements are a common element of many pages, and dealing with them can be a bit tricky.
The Problem
When your parent div contains a floated element that has a height greater than that of the non-floated elements in the parent div, the floated element will expand past the border of the parent div.
Here’s a simple page with this problem
Here’s the source code:
<html>
<head>
<title>
CSS Demo:
Expanding divs to surround their floated contents
</title>
<style>
div {
padding: 1em;
}
#container {
border: 1px solid black;
background-color: #ccc;
padding: 1em;
margin: 1em;
}
#floated_div {
float: left;
width: 200px;
border: 1px solid red;
}
#content_div {
width: 150px;
margin-left: 250px;
border: 1px solid blue;
}
</style>
<head>
<body>
<div id="container">
I am the container div.
<div id="floated_div">
<p>
I've got a lot of stuff in me, and will
overflow the boundaries of the container div.
</p>
<p>
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit.
Suspendisse eleifend lorem id sapien.
Nam eget odio. In
diam. In quis massa non lorem sollicitudin
pretium.
Praesent enim purus, nonummy in, varius
ut, consequat a,
nisi. Etiam at turpis. Praesent porttitor eleifend
magna.
Aliquam erat volutpat. Fusce porta blandit dui.
Suspendisse
rutrum est in urna. Nullam condimentum arcu a
nulla. Mauris
suscipit accumsan urna.
</p>
<p>
Nunc erat lacus, euismod quis, malesuada quis,
ultricies
at, tortor. Vestibulum placerat scelerisque arcu. Ut
ultrices mi ac augue. Mauris condimentum molestie
enim.
Integer sem. Lorem ipsum dolor sit amet,
consectetuer
adipiscing elit. Nulla facilisi. Integer ac sem. Sed
ipsum
purus, mattis eget, sodales et, semper ac, sapien.
Morbi
ipsum neque, pretium at, placerat nec, sodales non,
orci.
Cras magna risus, lacinia eget, sagittis sit amet,
egestas
id, quam. Cras quis diam. Cras varius metus et est.
Aliquam
ullamcorper, massa a rutrum porttitor, tellus nibh
elementum
tortor, vitae pulvinar nulla ante eu magna. Lorem
ipsum dolor
sit amet, consectetuer adipiscing elit. Curabitur
laoreet
elit at est. Duis at libero id lorem ultricies accumsan.
Sed
gravida volutpat nibh.
</p>
<p>
Proin hendrerit accumsan arcu. Maecenas aliquam,
urna eget
ornare facilisis, justo felis ultrices enim, vel porttitor
tellus lorem a metus. Class aptent taciti sociosqu ad
litora
torquent per conubia nostra, per inceptos
hymenaeos. Nulla
ante. Suspendisse potenti. Sed feugiat imperdiet
arcu. In
tellus eros, pretium at, ultrices sed, fermentum eu,
enim.
Donec nisl mi, egestas et, malesuada at, varius quis,
nibh.
Proin dignissim mattis libero. Sed tellus quam,
dapibus eget,
mollis quis, vehicula a, massa.
</p>
</div>
<div id="content_div">
I'm an unfloated content div.
<br />
My parent div will expand to fit around me.
</div>
</div>
</body>
</html>The parent div has a background that I’d like to have extend behind the floated content, but the way it is right now, it won’t work.
The Solution
The solution is surprisingly simple. If you add a div with clear:both as it’s style just before the parent div closes, the parent div will expand to fit the floated div.
Why does it work?
When you specify clear:both as the style on an element, that element will clear all divs above it to the left and the right. This forces the clear:both div below the floating div’s lower boundary.
Since the clear:both div isn’t floated, it forces it’s parent div to expand to fit.
A Google Search Feature I'd Like to See
Currently, Google will do certain calculations, conversions and information look-ups when you type them into the search box.
For instance, you can ask it to convert pints into cups, or miles to kilometers.
There are similar features for getting the population of cities, the current weather, movie listings and word definitions.
I’d like to see Google do some date math so that I can ask it things like “today + 14 weeks” and it would give me information about that day.
Perhaps there’s another search engine or tool out there that does this already? If you know of one, please post about it in the comments.
Apps - Process Explorer
When a file is in use by another program wouldn’t it be nice to know what program it is instead of randomly shutting down applications until you find the right one?
Well, today’s your lucky day.
Download the Windows SysInternals Process Explorer program and save it somewhere sensible like C:\ProcessExplorer\ There’s no installer, so where you save it is where you’ll be running it from.
Run the application, then go to Find -> Find Handle or DLL… and then type in the filename for the file that’s being used by another program.
Click search, and you’ll get a list of applications that are accessing the file.
Now you know which application you need to close to make changes to your file.
New RSS Feed
Tangible is now using Feedburner for it’s RSS feed.
For now, the old feed will still work, but in a month I’m going to turn it off, so now is a good time to switch your subscription over to Feedburner.
Just click on the RSS icon to the right and add the new feed to your reader!
Shaking off Tiredness
Maybe you had a bad night’s sleep, or you’ve just been stressed out for a while. For whatever reason, you’re not feeling very alert and it’s making for a very long day of newbie mistakes and clock watching.
A lot of people use coffee, red bull or other caffeine-rich drinks to deal with this feeling. I find it leaves me feeling shaky and occasionally nauseated.
Whenever I feel like I’m danger of performing a keyboard face plant at my desk, I have sushi for lunch…but not just any sushi: salmon & avocado sushi made with brown rice, and goma-ae (a cooked spinach salad with miso-sesame dressing) on the side.
Why? It’s a highly nutritious meal and provides a good dose of healthy fats, protein and complex carbohydrates. The brown rice contains B vitamins, which help to increase energy levels.
After a meal like this, I feel a more alert, less physically tired and able to take on the rest of my daily tasks without drifting off into the middle distance too often.
How do you take care of yourself on days like this?
Testing the Unknown
One of the guidelines to follow when writing functional tests is to use real-world data in your tests.
So, how do you write real-world tests for an inherited application that deals with a subject matter on which you have insufficient knowledge?
You don’t. Really!
The Selenium IDE is a fantastic Firefox plugin that lets you record everything you do in your browser and then lets you replay, step through or edit the recording.
When faced with functional testing an application in an obscure-to-you field, you can have someone who knows what the application should do run through a bunch of activities with Selenium IDE recording every move they make.
Then you can go back through the recorded test and start building up a test suite.
Hurray!
xkcd Takes on Regular Expressions
Some of you may have seen this already, but hey, I just found out about it today, so I’m posting it. Click for the full-sized version.
A New Design!
I’ve renovated the site with a slick new design.
I was inspired by by the layouts on Alessandro Fulciniti’s Nifty Corners Cube web site. In fact, I used his handy javascripts to make all these nice round corners without any images.
Hope you like the new design!
