CSS Endless Voids of Time with display: inline-block

The evil seduction of working with CSS comes in the form of its ease of use—in theory. The problems start when you drift into complexity. I find it a psychological game where you are constantly tempted to trap yourself in something complicated (usually because Microsoft Internet Explorer continues its decades-long tradition of not supporting something correctly). You can look up and find hours have gone by because the layout fails to show the expected results.

The way to get out of this physiological trap is to find a way to strip out the complexity down to a known state. Many of these known states (from my CSS work) are preserved in my Studio. My latest specimens mark a big change in my block layout strategy. Before support for display: inline-block was widely available, my strategy depended on using the float property.

Using float on one block (usually an image) next to a larger static flow (like a paragraph) is still very attractive to me. But floating multiple blocks can be frustrating. This is where display: inline-block comes to the rescue. But this new tool in my chest is not perfect. In “CSS display: inline-block: why it rocks, and why it sucks,” Robert Nyman writes:

I hope so far that I have managed to get you to realize the potential and simplicity of this approach. However, there’s one giant drawback, that might or might not apply to your use case. That is, since the elements become rendered inline, white-space in your HTML code will affect the rendering.

I literally spent hours (maybe two or more) struggling with this white-space issue. According to a German donkey on StackOverflow.com, the official way out is use white-space-collapse: discard. But, typically, this property is not supported on most browsers. So a hack (typical, again) was suggested—use HTML comments:

<p><!--
  --><img src="." alt="" /><!--
  --><img src="." alt="" /><!--
  --><img src="." alt="" /><!--
  --><img src="." alt="" /><!--
--></p>

I haven’t tried this in Visual Studio for fear of needing to tweak my code formatting settings.

Another very subtle problem I had was accidentally nesting an inline-block display within an inline-block display. I am no CSS “ninja” so I see no reason why I need to do this. It took a significant amount of time to strip this complexity away and get back to a known state. I wasted time trying to convince myself that Firefox’s implementation of inline-block did not support siblings with different margins. My Studio sample proved me ridiculous. What was really going on was the unwanted nesting.

“Announcing Entity Framework Code-First (CTP5 release)” and other links…

Scott Guthrie: “EF Code First enables you to use ‘POCO’—Plain Old CLR Objects—to represent entities within a database. This means that you do not need to derive model classes from a base class, nor implement any interfaces or data persistence attributes on them. This enables the model classes to be kept clean, easily testable, and ‘persistence ignorant’.”

“EF Feature CTP5 Released!”

ADO.NET team: “CTP5 includes some significant internal refactoring in preparation for some features we intend to support in the future, we are still in the process of stabilizing the quality after this refactoring. We decided to release before we finished this stabilization to get CTP5 in your hands as soon as possible and give ample time to incorporate feedback before we RTM.”


Entity Framework Architecture

“PowerToys for the Class Designer and Distributed System Designer”

CodePlex.com: “The Class Designer Enhancements add-in provides additional functionality for the Visual Studio Class Designer, such as HTML export and nested type creation commands. This download includes all necessary source code and a Visual Studio project template for creating your own add-ins for the Visual Studio designers. The Class Designer is a developer productivity tool available in Visual Studio Standard Edition and above, which allows developers to easily visualize, design, refactor, and document their code.”

“ELMAH: Error Logging Modules and Handlers for ASP.NET (and MVC too!)”

Scott Hanselman: “ELMAH is one of those largely unknown and deeply awesome .NET Open Source projects that should be part of ASP.NET proper.”


Øredev 2008 - Day 1

“That No SQL Thing—Document Databases”

Ayende Rahien: “A document database is schema free, that is, you don’t have to define your schema ahead of time and adhere to that. It also allow us to store arbitrarily complex data. If I want to store trees, or collections, or dictionaries, that is quite easy. In fact, it is so natural that you don’t really think about it.”

“Visual Studio Programmer Themes Gallery”

Scott Hanselman: “More and more I find myself ‘skinning and [theming]’ my Visual Studio development environment in order to stay frosty. It’s surprising how changing your theme (fonts, colors, etc.) can re-energize me when I’m having trouble with some problem or motivation.”

“Native php support in Visual Studio 2010?”

StackOverflow.com: “Check out CodeLobster php, it’s free and has a very similar look and feel to visual studio plus it has IntelliSense and debugging support.”

VS.Php for Visual Studio

VS.Php is a Php integrated development environment based on Visual Studio. With VS.Php you can design, develop, debug and deploy Php applications within the Visual Studio IDE. VS.Php key features are around providing rich Php and Smarty editing capabilities as well as its ability to debug Php scripts locally as well as remotely.”

FunkyKB: “Explicit vs implicit SQL joins” and other notes…

Stack Overflow: “Personally I prefer the join syntax as its makes it clearer that the tables are joined and how they are joined. Try compare larger SQL queries where you selecting from 8 different tables and you have lots of filtering in the where. By using join syntax you separate out the parts where the tables are joined, to the part where you are filtering the rows.”

“How do i write the literal "]]>" inside a CDATA section with it ending the section?”

Stack Overflow: “This ends up breaking the CDATA section in two parts, but it’s what you have to do…”

]]&gt;]]&gt;<![CDATA[

Issues like this should be more and more moot/antiquated for my needs as the .NET framework in general and LINQ to XML in particular provide facilities that make these “tricks” unnecessary.

More Old Stuff: “What’s New in FOR XML in Microsoft SQL Server 2005”

MSDN: “There will still be a few cases where you may want to use the EXPLICIT mode (in order to generate CDATA sections or to use the !xmltext directive, for example), but the new functionality should make the “query from hell” a much less frequent encounter.”

“SQL Server Index Basics”

simple-talk.com: “For composite indexes, take into consideration the order of the columns in the index definition. Columns that will be used in comparison expressions in the WHERE clause (such as WHERE FirstName = 'Charlie') should be listed first. Subsequent columns should be listed based on the uniqueness of their values, with the most unique listed first. ”

Funky KB: Windows 7 and Windows Server 2008 Notes

TechEd Analyst summit giftWindows 7 Keyboard Shortcuts

Microsoft publishes a comprehensive Windows 7 keyboard shortcuts list. This is a novelty to me. In the past we needed a third party to do this for us.

Speaking of ‘third party,’ serverfault.com has “Useful Command-line Commands on Windows”…

The “Copy As Path” Command in Windows

This article, “Copy Path of a File to the Clipboard in Windows 7 or Vista,” tells me (indirectly) that dragging a dropping a file on the Console no longer passes the path information to that file to the command line. I used this feature frequently but it was probably depending on a security hole. Now, we have to “hold down the Shift key, and right-click the file… Choose the Copy as Path from the menu.” This command does not appear in the right-click context menu without holding the Shift key.

Windows Server 2008 Security and XSL Transformations

Yours truly wrote “‘(503) Server Unavailable’ with call to XSL Transform in Windows Server 2008” on stackoverflow.com to memorialize an issue with XSL Transformations in .NET. As I move over into the XObject world, my captive hope is for this issue to e very, very obscure.

“Backward Compatible Networking with Server Core ”

Sander Berkouwer in “Backward Compatible Networking with Server Core” writes:

I’ll try to explain the ‘Next Generation IP Stack’ which was introduced with Windows Vista and is also present in Windows Server 2008, both in Full and Server Core installations. I’ll show you how to tweak down some default global TCP settings, that are part of what Microsoft calls the “Scalable Network Initiative”.

Last year (approximately) I found some compatibility problems with Windows 7 (Vista) and older Windows machines (and, of course, Linux machines). The summary of shell commands to use to completely disable “next generation” stuff are:

netsh interface tcp set global rss=disabled
netsh interface tcp set global chimney=disabled
netsh interface tcp set global autotuning=disabled 

To simply take a look at what’s going on use:

netsh interface tcp show global

The technical terms for future study are: Receive-Side Scaling, Chimney Offload and Receive Window Auto-Tuning.

FunkyKB: ASP.NET MVC (and Web Forms) Topics

I do appreciate working directly on the latest ASP.NET MVC technology these days for actual money. Extreme penny pinchers use Microsoft technology and these cheapskates tend to stay behind the latest stuff—in my experience over eight years behind. With this great opportunity comes great responsibility. So, today, let’s try to see how well a developer with salt-and-pepper hair can respond to what the kids are pounding out in Redmond:

One incorrect assumption I made when looking at ASP.NET MVC was the pessimistic view that the classic Web Forms crowd would jealously stand still. Yes, the release of ASP.NET 4 would be some sad competitive crap that would childishly ignore what the MVC team was doing. My assumption was wrong. Dan Maharry’s “ASP.NET 4.0 Part 12, Routing Helper Functions”:

With our routes defined, we can now set up hyperlinks between routes. All we need are the name of the route and the values of any route parameters. If we need to do it inline in the code (perhaps because it’s part of a data-binding operation) we can use the new <%$RouteUrl %> syntax.

My copies of my bookOne (me) could make the mistake that since the ASP.NET Page Life Cycle Overview as described by MSDN appears to not have changed (much) for years, this appearance of Routing (from the MVC world) could easily be overlooked as Routing is plugged in higher in the stack, above the ASP.NET “Page” concept (it’s an HTTP Module). Better than this MSDN piece is the award-winning CodeProject.com article, “ASP.NET Application and Page Life Cycle” by Shivprasad koirala (see also: “What is the ‘page lifecycle’ of an ASP.NET MVC page, compared to ASP.NET WebForms?” from StackOverflow.com). In attempt to not overlook here, one has this: “What’s New in ASP.NET 4 and Visual Web Developer”—and this: “URL Routing with ASP.NET 4.0” by Brij.

One terrible way to approach ASP.NET MVC for the first time is to be the guy that is “Using WebControls In ASP.NET MVC Views.” Having this very thoughtful article in my personal notes show my careful consideration for MVC beginners coming from the world of Web Forms, tempted by “the obvious.”

This MSDN article, “Events in ASP.NET Master and Content Pages,” lists no less than 17 events for ASP.NET master pages. This list clearly applies to Web Forms as any “control loading” events should not exist in ASP.NET MVC (but they do).

I need to form the habit of regularly reviewing the System.Web.UI.HtmlControls Namespace. New controls,  like HtmlLink, have been added since ASP.NET 2.0. Also, knowing how the Control.ClientID property works is also futuristic in ASP.NET land (actually, the knowing the role of ClientIDMode is the key here).

What should make ASP.NET look super cool to any developer that likes to write code is what Rob Conery writes about in “ASP.NET MVC: Securing Your Controller Actions”:

ASP.NET MVC Preview 2 introduces the new ActionFilterAttribute, which allows you to declare “Filter Attributes” for the actions on your controller. Think of these things, in essence, as OnLoad events—a bit of code that’s executed before or after your Action.

This use of attributes for a Web application goes farther, one can see this in “is [AcceptVerbs(HttpVerbs.Post)] deprecated or to be deprecated in ASP.NET MVC 2 or later?”:

No, it’s not deprecated, and it won’t be, because [AcceptVerbs] is the only way to decorate a method that accepts several (but not all) verbs.

[AcceptVerbs(HttpVerbs.Post | HttpVerbs.Put)]

It’s also the only way you can specify a verb that’s not one of the “core four”, such as those which are part of WebDAV:

[AcceptVerbs("LOCK")]

Matt Hawley shows me that the use of attributes make secure patterns like the “ASP.NET MVC—Using Post, Redirect, Get Pattern” possible.

Finally, this article, “Integrating Silverlight and ASP.NET MVC,” by Tim Heuer gets me back into triple-threat mode by using JSON (with DataContractSerializer) from ASP.NET MVC to be consumed as POCOs:

Why not use System.Json and LINQ to JSON? You could absolutely. In doing so you could use your LINQ skills and get the data out of the Json stream and put it into a new object. You’ll still have to create a local class representation because Silverlight can’t bind to an anonymous type. This is the first reason I like just using the serializer. The second reason is size. I don’t know why I’m so picky, but I am. Using the DataContractSerializer method here, my app is about 7K. Adding a reference to System.Json and using those methods, my app is 27K. For me, there is no additional benefit in code for what I’m doing to add that extra size, so I choose not to. But you can…absolutely. Your application needs may be different and the size cost/benefit analysis may result in a different outcome than mine…but there, I’ve stated my reasons here.

My triple-threat (my “grand unified user interface”), by the way, means to be ASP.NET MVC, WPF and Silverlight:

GUUI: Grand Unified User Interface