1. Fully Working inline-block

    .inblocks {
      position: relative;
      font-size: 0px;
      *font-size: 0.1px;
    .inblocks > * {
      display: inline-block;
      vertical-align: top;
      font-size: 12px;
      zoom: 1;
      *display: inline;


    First condition is that you must set width for each elements in .inblocks.

    With first condition in mind, you’ll need to have only same tags as child elements like:

    Or you’ll need to have id or a way to differentiate one elements to another like:





      <div id=”header”></div>
      <div id=”body”></div>

    To mimic float:right, use position: absolute. 

  2. font-size: 0 Crashing IE8 + Inline-block issue with IE7

    .inblocks {
      position: relative;
      font-size: 0.1px;
    .inblocks > * {
      display: inline-block;
      vertical-align: top;
      font-size: 12px;
      zoom: 1;
      *display: inline;

    Adding an asterik ‘*’ gets ignored in modern browsers, use it to target IE and change the display to inline. Not to forget is the combo with zoom: 1.

    'font-size:0px' crashes IE8, instead, used 0.1px instead. Gets the job done while keeping the whitespace out at the same time.

  3. IE7 overflow:hidden Issue

    Add ‘position: relative’ to solve it.

  4. position: relative + absolute combo VS float: left + right

    So basically, if your content is static, choose position; if it’s dynamic, go with floats.

  5. My Hack For Margin Doubling In IE6

    Set the min-width larger than width.

    Modern browser will take the min-width value while IE will take the width cause it will fail to recognise min-width.

  6. TIL About GNU Screen

    Ctrl + A -> C
    New screen

    Ctrl + A -> Spacebar
    Cycle screen 

    'screen -r'
    Restore screen

    'screen -d'
    Detach screen

    Best part is, sessions are stored! Need to figure out how to set higher buffer output though. 

  7. Why are column oriented databases so much faster than row oriented databases? - Terence Siganakis →

  8. Slide Left/Right →

    All these times I have been writing left/right slider wrong. I previously used animate() by ‘margin-left’ or ‘left’ but I have never thought of using outerWidth() combo! Not to mention the width: ‘toggle’, smart.

  9. Perl So Far

    I’m starting to get the hang of Perl. I am slowly getting comfortable with the syntax.

    I haven’t get the chance to touch Catalyst and I’m doing most of the development in Embperl because of the client’s arrangement.

    My client helped me a lot in the learning process by writing a few patterns for me to follow and pick up quickly.

    The hardest part I found about learning Perl so far is that the language uses referencing like hashref and so on. Also, learning DBIx::Class can prove to be a challenge. I usually have Perldoc and DBIx::Class documentations tabs opened.

    Reading codes written by the previous developers helped a lot too.

    Hope I’ll get more exposure and experience. I am really starting to like Perl.

  10. This is the reason why I main the Chrome Developer Tools for my front-end work.

    (Source: youtube.com)

  11. IE6 & IE7 Object Literal Comma Bug

    Was debugging an ajax script and the problem was that little comma after the last key-value in object literals.

    Even though modern browsers nowadays are very forgiving, IE6 and IE7 are not. So reminder to those practising this coding conventions of inserting a comma on the last object element:

    var options = {
      key1 : value1,
      key2 : value2, <------- remove this mother fucker

  12. Making Sub-menu Animation Stick

    $('.projects').parent().add('#project-list').hover(function() {
      $('#project-list').clearQueue().stop(true, true).fadeIn();
    }, function() {

    A combination of .add() and .clearQueue().stop(true, true).

  13. The Duct-tape Of The Internet

    So I got a job which requires me to learn Perl. Started reading up on it few days ago and tried to install the Catalyst framework through cpan but to no success.

    Spend an entire night trying to sort it out. Installed multiple copies or Perl and tried multiple solutions still couldn’t get it going. Was on the verge of a breakdown. Went to sleep and woke up this morning trying to fix it again.

    Searched around and a forum thread from years ago helped me (reminds me of the comic from xkcd), oh how I love you Internet.

    The problem apprently is that I have added a value in my registry to autorun my ‘C:\xampp\htdocs’ path whenever I fire up my command prompt. This has been causing the dmake tool that comes with Strawberry unable to create and write the blib folder in the supposed directory while installing cpan modules. Unset it solved the problem.

    With few more hours to go, I am expected to complete the tutorial and hopefully got the demo running to show to my client. Let’s hope Perl is forgiving on me for the next few hours.

  14. A List Apart: Articles: CSS and Email, Kissing in a Tree →

    TIL that different email clients have different support for CSS. For instance, GMAIL doesn’t render CSS at all.

    The article gave a few suggestions and tips which are:

    • Use inline-styling.
    • Using td.myStyle {} instead of just .myStyle {} to take precedence over the client’s CSS
    • I thought the smarter hack was to use a parent <div> right after your <body> tag and just put all your inline-styling there.
    • Oh and use old style HTML like <table>

    This site lists all the styling that most email clients support nicely.

    And this tool from MailChimp converts your <style> into inline-style for you. Works like a charm but be careful if you have <? php ?> codes inside your template. The ‘<’ and ‘>’ will be replaced with &lt and &gt respectively.

  15. Google Testing Blog: Singletons are Pathological Liars →

    Yet another post about dependency injection. This one explains it with a real-life example and go through each thought process. Easily understandable.