All browsers have their flaws, that’s for sure. But sometimes you see pure stupidity, and then it might be worth writing something about it.
If a web page doesn’t have a doctype, it usually means that the page is either very old or created by someone that don’t care or doesn’t know anything about doctypes. The strange thing though is that Internet Explorer treats those pages as something completely different than normal, modern web pages. If you don’t add a doctype to your HTML document, Internet Explorer will not rely on it’s rendering rules any more. For example: If you set both a width and a padding to an element, normal browser rendering makes the total width of the object to be width+left padding+right padding.
.box {
padding: 10px;
width: 200px;
}
The total width of .box becomes 220px. However, without a Doctype to rely on, Internet Explorer does not default to a simple Doctype like HTML 4.01 Transitional which would follow this rule. Instead it decides that the page is not worth a second chance, and some rules are rendered incorrectly. In this example, .box would actually become 200 pixels wide according to IE’s rendering.
You might think that this is not a big deal, but consider that other browsers are smarter than this, which makes the crossbrowser rendering of the web page a mess. It is also a fairly unknown and “not so easy to discover” kind of bug which makes it even harder.
Read about the existing Doctypes and why you should use them over at A List Apart: Doctypes.
UPDATE 2008-03-20: This bug is easily resolved by upgrading to the latest Beta version of Firebug (currently 1.1). Thanks to PatternHead!
I’ve experienced this bug for quite a while now, and it is really annoying. Basically you can’t inspect an anchor in Firebug, and there’s no way around it.
Today I had enough and decided to do a thorough search on the web to get rid of the problem.. Looks like it’s a well known bug. Someone suggested that I’d revert back to Firefox 2.0.0.11, as it didn’t have this bug. I found an old version, sadly a .exe though. I could not find any mac equivalent, until I stumbled across a Ukrainian .dmg file… So now my Firefox is in crazy Ukranian, but at least it works properly!
For those that haven’t heard, the swedish TechStar is now back in Boulder for 3 months. I’m working hard at our new (not very shiny but OK offices) on 1980 8th St, feel free to drop by.
TechStars was a great experience for everyone involved, and we’re all keeping a close contact with the other teams and mentors. This video was posted on techstars.org and gives you insight in what we all think TechStars was: A pretty darn awesome experience!
As you probably know I’m a cofounder and User Interface Designer at Intense Debate. We just released a big update to our revolutionary commenting system, that’s basically a total makeover graphically. I think you can tell that I’m excited!
One of the most noticable changes/improvements is the “User Information Box” that displays when you hover an avatar. It’s almost like a mini-profile-mashup from alot of different things. The idea is that it should tell you alot about the person you’re interested in, and still look OK if the person has not supplied much data. A screenshot of this new feature is next to this paragraph.
There’s much more to this update, if you’re interested I suggest you go read (and subscribe!) to our company blog: Inside the Debate.
It’s amazing how some things change rapidly and how others.. Well, doesn’t change at all. It’s 2008 and I still work as hard as ever. One thing’s for certain: This is the year. So much exciting stuff will happen this year.
I’m working on a little side project for Adept Web Solutions while Intense Debate stabilizes. I thought I’d post something about that on here later.. It’s cool stuff. I’m also hoping to update the blog a little bit, already getting tired of it.
I’m glad to report that Intense Debate has ended it’s Closed Beta period and is now entering an Open Beta! These are very exciting times, and it’s amazing to see how well our service performs with this sudden hiatus in the traffic. The Chameleon theme is also performing fairly well, even due to my complete rewrite. I’ve only had to fix one or two small things.
So if you have a blog, go check out the newest, and brightest shining star on the Internet for today: Intense Debate Comments. Installing it on Blogger and typepad with a widget is a breeze, a Wordpress install is really easy. www.intensedebate.com
If you have any complaints/questions/suggestions about the interface or the commenting experience altogether, please drop me a few lines. I’m always working on making the Intense Debate Comments your dream commenting system come true.
I don’t know if this is common knowledge among webdesigners, but this was all new for me. If you don’t select a color for a border, just say “border: 1px solid;” (for example) it will inherit the color of the current object. I’ve checked this in Firefox 2 and Opera 9, and it really works here.
I’m not very experienced in Flash. I can do basic movies with tweens, some playback buttons and maybe one or two animations, but that’s pretty much it. For a recent project however, I had to do a pause button.
Now this might seem like an easy task, but it isnt. A pause button must both pause and play the video. I looked around the web for some easy solutions, but couldn’t come up with anything useful (although I’m sure there are guides for it out there, I just didn’t look hard enough..). This is what I came up with:
How to create a Play/Pause button in Flash
1. Create a movieclip called “playpause”. Put this movieclip anywhere in your main movie.
2. Create a button in this movieclips first frame, call this button “pause”.
3. Now go to frame two, create a keyframe and another button, call this one “play”.
4. Create another layer, call this layer “script”. Put the marker in the first frame and open Frame Actions. Type in “stop();”. Create another keyframe, and do the same thing again.
5. The buttons need some actionscripting too to be able to work. They need to both make the other button display and to play and pause our movie, which is the main target. I found a way to do this really easily. Click the button “pause”, and open Button Actions. Then type in:
on (release) {
gotoAndStop(2);
_parent.stop();
}
The first line displays the play button, the other one pauses the main movie. Select the other button, “play”, and type in:
on (release) {
gotoAndStop(1);
_parent.play();
}
Save the document, press Command+Enter (PC: CTRL+Enter) and make sure it works.
I hope you found the guide useful! Please leave a comment below and let me know what you thought.
For those that haven’t heard, the swedish TechStar is now back in Boulder for 3 months. I’m working hard at our new (not very shiny but OK offices) on 1980 8th St, feel free to drop by.
One of the most noticable changes/improvements is the “User Information Box” that displays when you hover an avatar. It’s almost like a mini-profile-mashup from alot of different things. The idea is that it should tell you alot about the person you’re interested in, and still look OK if the person has not supplied much data. A screenshot of this new feature is next to this paragraph.