Is anyone else getting sick and tired of hearing the rants by people at Opera about how Microsoft isn’t doing enough for their business? I sure am and in the latest round Opera’s “chief technology officer,” Hakon Wium Lie has suggested that by Microsoft allowing the use of logos in the new browser ballot system will make users naturally gravitate towards IE because of the branding.

First off, Microsoft shouldn’t have to play nice and give users a ballot. When you load up any distro of Linux you don’t get a ballot that includes IE. Similarly when Mac users turn on OSX for the first time they don’t get a ballot with IE, Opera and Firefox. This is simply another case of the EU wanting to take down Microsoft for being successful while allowing the underdogs to run free because their products suck.

To allow Opera’s idea of no logos would be rediculous to say the least. Essentially what we have here is one company complaining that it can’t make ground in an overly saturated market because Microsoft and Microsoft alone is forcing users to use Internet Explorer. Last time I checked, there was no forcing and FireFox was making serious gains on the browser from Redmond. It seems that this latest episode is a simple case of poor branding (Opera) trying to take down good branding (IE).

Perhaps instead of complaining so much about other companies’ software packages, Opera should worry about making and advertising a decent product.

Actually, that is quite unfair to say because CSS itself (language/syntax) is okay on its own. It is the standards body and the set of standards they decided upon that cause nightmares for millions of developers and designers each day. This should be no secret for anyone who has attempted to get a site to work 100% in each browser, that is without a single pixel off. While it certainly is possible, the hacks often required to do so have been passed down through the generations of the language.

height: 100% – in your dreams
You would think that making a div have a height of 100% would mean that it would fill whatever space it was within. Not true! It works so long as the parent div has an explicit height. Note that it doesn’t work on this page. Note that while the right div has a height of 100%, it doesn’t adjust to fill the space created by the left div. Note that if you do not have the Clear div in there, you won’t even see the wrapper’s background. In otherwords, it doesn’t grow with its own content. Good job on those standards!

To fix this we have to define some explicit heights. By giving the Wrapper div a height of 800px you will notice that not only does the height setting work all of a sudden, so does the background! View the new code here.

While this is nice and all, it sucks for anything that has fluid height. The real fix for this is to move the right column’s bottom div outside of the right column and create two more columns afterwards. But now that div is outside the height of the left column which could make for an awkward gap, especially if you have a background image that provides a border. Enter the hacks: by adding a negative margin we can move the div back up into the column above it. See the final page. Congratulations, we have now entered the realm of CSS hacks and from here on out there is no turning back.

Margins and Padding In Nested Elements
Why is it that margins and padding in nested elements always seem to affect their parent elements? Furthermore, why can’t I define an explicit width and then give it padding? Why must the padding always be changed with the width? This makes for unreadable CSS that forces you to do addition and subtraction on the fly to get the true width of the element.

This one is simple: attaching the site’s content to the top of the page. This is easy enough as demonstrated here. No real trickery is required; just set the body and html tags to have a padding and margin of zero on all sides. If you are working in ASP.NET you may need to set them for the form as well. Never-the-less the two CSS properties do as we expect them to, at least until we add some real content. Just by adding a simple h1 and p tag we have already corrupted the parent element’s placement on the page.

Why does adding elements with a top margin to a nested element change the positioning of the parent element itself? In some cases (and probably here too, I don’t have WebDev bar installed here) the entire body is moved down because of this top margin issue. Regardless of that, a child’s positioning should never affect the position of the parent except for in specific/explicit cases. An element’s margins and padding should always be relative to the container it sits in and sibling elements. But instead we have to deal with setting top margins to zero now because of the CSS standards.

XAML Rocks
Which brings me to my point – the CSS language isn’t broken, the standards we follow are. If you look at Microsoft’s implementation of similar features in XAML, you will see that the standards they use actually make sense for all of those involved. Let’s look at the first problem I mentioned: advanced column layouts with a bottom positioned element in the right column. In XAML we can use a Grid to create the two columns, but many will cry out that is too easy and "tables" shouldn’t be used for layout purposes. Instead we can use the Grid as we would use a Div in HTML. We use the HorizontalAlignment attribute to tell each Grid to "float" which creates the columns. Much to the web developer’s surprise, XAML does exactly what you tell it to do!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<Window x:Class="BottomPositionedElement.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="600">
    <Grid Background="#2D2D2D">
        <Grid Background="#DFDFDF" Width="340" Margin="10" HorizontalAlignment="Left">
            <TextBlock>
                Some content would go here and stuff.
            </TextBlock>
        </Grid>
        <Grid Background="#8F8F8F" Width="200" Margin="10" HorizontalAlignment="Right">
            <Grid Background="YellowGreen" VerticalAlignment="Bottom" Margin="10">
                <TextBlock>Hello, world! I am a bottom positioned "div"</TextBlock>
            </Grid>
        </Grid>
    </Grid>
</Window>

My point is to raise the obvious question: If Microsoft can implement its own set of XML tags and write a standard for them that makes sense and works, why can’t the HTML/CSS standards bodies? To blame this on the browser manufacturers at this point is just silliness since IE8, Chrome, and FireFox all have similar isses. That is to say that they follow the standards but what you expect is not what you get.

I sure hope so. The Zune is a great device for many reasons, most important to me being that it works every single time I want it to. I use the Zune software everyday and while it does crash sometimes, it isn’t morbidly slow and isn’t bloatware. The problem, however, is that the Zune really hasn’t received the hardware treatment it deserves. No touch screen, a touch pad that is glitchy (specific spot on the pad), and lack of full graphics development (no shaders) really hold it back. Hopefully this Zune “HD” will fix all that…

Shots via Engadget

As Jason Zander shows on his blog, Visual Studio 2010 is looking gorgeous in its WPF kit. The added capabilities of the IDE and the power extensions now have will put this software above and beyond the rest for many years. If Microsoft still does one thing brilliantly, it is write great IDE software.

They may have retooled enough to become efficient at repairing red ringed Xbox 360 consoles, but boy do they suck at general support. A week or two ago my 360 stopped being able to play NetFlix video over HDMI, stating that a “secure HDCP link could not be found.” Contacting NetFlix has been resourceful in the past, so I did this with no luck. After explaining I was in a preview program for the new dashboard, they redirected me to Microsoft. So that is where I went! I didn’t feel like calling them and waiting on hold for hours and hours and thus emailed them. Here is the response I just received.

Hello John,

Thank you for contacting Microsoft online support for XBOX. I am XXXXXXXXX and I will be helping you today with this issue.

As I understand it, when you use an HDMI cable to connect your Xbox 360 to your HDTV or monitor, you experience one of the following display issues:
. A green or purple tint to the video
. Extensive flickering for more than several seconds when you play video, use the Xbox Guide, or switch from the Dashboard to a movie
. Image “ghosting”

I know how disappointing it is that the cable you’re using is not working properly. Please be assured that I will do my best to help you resolve the issue.

Wow. So problems with this response? Well it doesn’t actually restate my problem but attempts to and fails miserably. I also love how they immediately blame the cable, as if that was the problem here. The email then goes on to suggest connecting to live to obtain automatic updates, unplugging my HDMI and plugging it back in as well as adjusting my HDTV settings to obtain “optimal resolution.”

Fortunately NetFlix did something internally because a day or two later the problem resolved itself. It turns out that some videos aren’t allowed to be streamed to the Xbox 360 and I just happened to be trying to play some of them. Movies that had stopped working that were working started working again like magic. And they thought it was my cable…. ha! Cables don’t just break, hardware that is known to go bad does.

What is Microsoft doing? SharePoint Designer is clearly FrontPage. It contains UI elements from both Office and some minor hints towards Visual Studio. But across Office, SPD and VS, the UI elements are horribly inconsistent and what is worse: the editors are too. But it doesn’t stop there because there is now Expression Web! All the Expression products from what I have seen are horribly different than any other Microsoft product out there. In some ways this is good, but in most cases it confuses me as to why certain functionality doesn’t exist.

At the end of the day, I really wish the window functionality (docking, hiding, etc) existed in all Microsoft products that contain even a small hint of that situation.