Post Archive
› March 11, 2003
Two little CSS hacks
Thanks to Nate for the invitation to the WebGraphics family :). Occasionally, I'd like to show here things originated in the Czech webdesigners community, which can be useful for everyone and are staying hidden for the english-spoken world. To start, here are two little CSS hacks.
The first hack shows how to vertically align a block inside another one. The CSS specification doesn't solve vertical alignment of blocks (adjacent nor nested). However, there are ways to align them at least in the Windows' MSIE5+ browsers. Vertical centering CSS hack.
The second hack tries to emulate the min-height CSS property in all browsers. Actually, only Opera and Mozilla/NN6 support it. A simple workaround makes the same functionality in MSIE. Min-height CSS hack.
Dave S. Posted…
Good to see the non-English community is active in figuring this stuff out, Petr. Hope you'll continue posting what you guys come up with. The second of these is great - works well in IE6/Win and NS7/Win on this end. The first only works in IE6/Win for me, but it seems to me that through extended use of the box model hack it might be possible to get it working in Mozilla? Either way, as with most hacks, they're still tailoring code to individual browsers, a practice we're trying to move away from. (case in point: Adrian's letter) It's pretty silly that there is no vertical-alignment functionality in the current CSS implementation, but between using a CSS hack and turning to table-based layout, it's still largely beneficial to choose the latter due to its wider support and consistency.