Week 18:

It’s the last week of work before Songkran Holiday and you can feel the anticipation for the crazy water festival beginning to boil up. People started wearing the iconic bright floral shirt and you can hear the classic Songkran song playing on TV, radio and pretty much everywhere you go. Too bad I didn’t get to stay in Bangkok to enjoy all the madness on April 13th, but coming home and visiting friends and family is also not such a bad idea.

Agency Portfolio Update:

web courses agency portfolioIt’s been a few months since we get to update our agency portfolio. I think this is a common problem that many agencies have, which is spending too much time working for the customer and not enough time to work on their own website! One of the things that I’m very proud of is the fact that I can add the website that I’ve developed onto the agency’s list.

glasford portfolio page

Placeit.net is a fantastic tool to create computer or mobile screen mockups, but only the smallest file size comes for free – you have to pay for higher resolution images. However, there are also many amazing mockups available online for free so here is a good list that I’ve found, make sure to check them out!


I spent a lot of time this week checking out this website after it has gone live. The theme used for the website proves to be quite a challenge to work with as the page builder keeps messing around with the alignment every time you click update. Furthermore, the logo slider on the homepage also didn’t work properly on IE (surprise surprise…) as only half of the logo is being displayed.

tractus broken logo slider

The solution that I use for this problem is using media queries to target only IE, and wrote some CSS to style the dysfunctional area. Please note that this method will only works for IE 10+, you would need to use an alternative solution for an older version of IE.  Here is the magic code that fixes the problem:

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

/* IE10+ CSS styles go here */


Please check out this article that provided me with this fantastic code.

And here is the final result:

tractus working logo slider


Internal Training: PSD to html (session 02)

This is a follow up class from our first session back in week 13. In this lesson we learned how to use the images that we acquired from the slicing tool on our website. Additionally, Carl also show us how to keep our style sheet looking clean and organized by separate our code into sections and emphasized that we should always commented our code.

psd to html session 2

In this exercise we only focus on the html and do not yet concern about the CSS of the page. The goal is to add all the required elements onto the page in the most reasonable and organized way. One of the good practices is to wrap each section of your page with a separate container so that it is easier for you to style using CSS. Although the page doesn’t look very impressive, you can see that the overall structure of the code is very well organized.

Until next time, Happy Song Kran 2015

songkran festival




Week 18:

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s