Posts Tagged ‘Stylesheets’

Anyone else tired of w3schools?

Friday, July 11th, 2008

… and the mediocre content they provide? I’m especially tired of the high ranking they (still) get in google. I go to hit google with “PlaceHolder asp.net”, and w3schools is the second hit. If you go read their page it has barely 3 lines regarding this control (highlighted with red outline), the remaining details are simply aggregate data, or advertising (outlined with green, doesn’t include all the further ads you’d see if you had scrolled down).

w3schools webpage screenshot
w3schools “3 lines of documentation” regarding the ASP.NET PlaceHolder class.

I mean, this is a total joke. When did w3schools start out? 2000? They became popular with their concise CSS properties listings back in the day. But seriously, it’s like this site is frozen in time. Their CSS reference point is 2.0 from 1998 (not that a mere properties reference would list much different from 2.0 and 2.1, but there are some minor additions.) I would prefer they would work on updating their CSS reference instead of wasting time on ASP.NET.

IE formatting oddity

Sunday, July 6th, 2008

It’s good to know that within 1 day of returning to any amount of CSS work, Internet Explorer can still baffle me. Maybe I’m missing something here, but seems that if a small tag (yes, let the damnations begin, but it was mostly due to the WordPress default template using it, that I came across it) does not include some trailing whitespace, it receives a little extra padding.

Small element rendering comparison
Rendering oddity with small tags with no trailing whitespace.

The HTML code used validates, should you wish to inspect it yourself. The “CSS1Compat” mode is merely to ensure we’re in “standards mode”.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head><title>wth ie</title>
<style type="text/css">
h2{
background-color:red;
margin-bottom:0;}

.wth {
background-color:green;
margin-top:0;}
</style>
</head>
<body>

<h2>foo</h2>    <small class="wth"> b ar </small>

<h2>foo</h2>    <small class="wth"> b az</small>

<hr/>
<script type="text/javascript">
document.write(document.compatMode);
</script>

</body>
</html>

You’ll notice I remove all margin on the elements. And indeed, the first header h2 and small does render correctly. But the second gets a 2 pixel margin added for … who knows what reason.

Reflections on max-width

Saturday, July 5th, 2008

A couple of years ago, I added a page to my old site on an “easy” fix for emulating max-width behavior in Internet Explorer, by utilizing a powerful IE5 feature called dynamix properties/expressions.

Briefly, these expressions allow a web author to hook script expressions into the dynamic nature of HTML elements. The natural events of the page (onresize, onclick, onmouseover and so on) causing these expressions to be re-evaluated whenever content could possibly reflow. The effect is naturally very powerful.

(more…)