W.J. Warren

I never knew/realised this, but it’s very useful to know:

The background of a Flash movie can be set to transparent. This allows the background color or image of the HTML page that contains the Flash movie to show through and allows the layering of Flash content with DHTML content.

Very useful when your Flash is on a layer in HTML that could be covered by something else when you’re scrolling the page.

Wmode not set:

Wmode not set

Wmode set to “transparent”:

wmode set to transparent

Source: Adobe TechNote

PS: Never mind the awesome (ahem) colours, this was just a quick test.

I’m working on a redesign of my homepage and completely forgot how much screen real-estate is available within a browser to display your website. A quick Google serach told me the following:

Screen resolution - available in browser
640×480 - 600×300
800×600 - 760×420
832×624 - 795×470
1024×768 - 955×600

Original forum post:
Available browser space for different screen resolution

Some interestion information about browser usage, including most common screen resolution, etc can be found at W3C’s Browser Information page.

I ran into the weirdest problem with IE today.

To test some functions I wrote for a Drupal page I outputted some values in a comment area (between ““) before the html-tag. In FireFox this works perfectly fine, but when I tested in IE my layout was ruined. Where the site was supposed to be centerd it was left aligned in IE. Also the min-height was neglected in IE. A strange problem but the solution was to remove the comment and everything worked like a charm again.

Don’t specify a width for the element (div_A) the float (div_B) is on top off. For some reason it will push “div_A” below the floating element.

I hope to find the reason for this…

Never ever use an absolute positioned DIV-element for print. It will make the printer print half lines of text at the bottom of the page. This gets even worse in FF, when there’s (theoretically) a second page, FF won’t print it.

Is so damn boooorrriiinnnnggg!!!

There’s a big difference between making a website look good on screen and for print. With a screen you can be save in using pixels for your fonts and more absolute measures. In print this is not done. First there are different paper-size, a4, letter, a3, etc… Than every printer has it’s own margins too. Next to that a printer most of times works in 300 dpi (dots per inch) while a screen is only 72 dpi.
So when ur marking a page up for print be sure not to use any absolute measures like pixels, but only to use relative ones like em, %, pt, etc…

Another screw up for print is using floats, they display different with every browser. As I just now discovered. FF (FireFox) displayed a div through another div, while IE displayed them below each other, as intended. I guess that’s what you get for using inline styles.
If you’re like me are using 2 stylesheets, one for screen, one for print. You have to take care not to overlook any !important statements in your CSS for screen. This can majorly screw up your print size. I had a width: 1003px !important defined, while FF printed the page just fine, IE(6) would let the page overflow and not print what ran off the page.

A nice article about printing HTML can be found here: http://alistapart.com/articles/boom

I am working on a website for a client and all of a sudden I see the last two characters of my last float being repeated on the site when I use Internet Explorer 6. This is a bug in IE6 and can be fixed the best way (imo) by putting a condition in your comment that IE should skip it, like this: