WordPress
Making the design to be responsive is very easy as shown in my Responsive Design in 3 Steps tutorial, but maintaining the elements to look aesthetically balanced on all breakpoint layouts is an art. Today I’m going to share 5 of my commonly used CSS tricks along with sample cases for coding responsive designs. They […]
Advertise here with BSA
Technorati Tags: blog
Original post by Nick La
Technorati Tags: blog
One of the common challenges when designing responsive design for mobile is the navigation menu. If the site has many sections or pages, it gets challenging to squeeze all the items into a small mobile resolution. The navigation most likely ends up running into multiple lines or the buttons stacking on top each other. So […]
Advertise here with BSA
Technorati Tags: blog, blogging, feed, google
Original post by Nick La
Technorati Tags: blog, blogging, feed, google
I’m proud to announce my latest CSS experiment—The CSS Social Buttons. They are not another "pure CSS3" or "HMTL5 canvas" icons. These icons use the basic traditional background-image technique. The purpose of these icons is to provide a cross-browser, consistent and versatile CSS that can be applied in any design, app or theme. Basically, it […]
Advertise here with BSA
Technorati Tags: blog, rss, feed, news, google
Original post by Nick La
Technorati Tags: blog, rss, feed, news, google
Previously I wrote two tutorials on how to style the image element with CSS3 inset box-shadow and border-radius. The trick is to wrap the image with a span tag and apply the image as background-image. However, I recently ran into a problem with that trick while designing the PhotoTouch theme. The issue is that the […]
Advertise here with BSA
Technorati Tags: blog, blogging, google
Original post by Nick La
Responsive web design is no doubt a big thing now. If you still not familiar with responsive design, check out the list of responsive sites that I recently posted. To newbies, responsive design might sound a bit complicated, but it is actually simpler than you think. To help you quickly get started with responsive design, […]
Advertise here with BSA
Technorati Tags: blog, blogger, blogging
Original post by Nick La
Responsive design all started with this article by Ethan Marcotte. Some people see it as a trend. But it is more than just a trend. It is a new design solution — it helps to resolve the design problems associated with the different resolutions and devices (desktop, laptop, tablet, and mobile). I’m giong to share […]
Advertise here with BSA
Technorati Tags: blog, blogging
Original post by Nick La
When applying CSS3 inset box-shadow or border-radius directly to the image element, the browser doesn’t render the CSS style perfectly. However, if the image is applied as background-image, you can add any style to it and have it rendered properly. Darcy Clarke and I put a quick tutorial together on how to use jQuery to […]
Advertise here with BSA
Technorati Tags: blog, blogger, blogging
Original post by Nick La
Those who create responsive design for iPhone may be aware of the viewport scaling bug in iPhone Safari. The bug occurs when you set the viewport width to device-width and rotate the phone to landscape view. To see this in action, view the bug demo page with your iPhone and rotate the phone from portrait […]
Advertise here with BSA
Technorati Tags: blog
Original post by Nick La
Technorati Tags: blog
I haven’t written any Photoshop tutorials for a while. Today I’m going to share a simple tutorial on how to create reusable background patterns with Photoshop and CSS. I learned this trick from designing WordPress themes. The trick is to create one reusable transparent PNG background and use CSS background-color property to create various color […]
Advertise here with BSA
Technorati Tags: blog, blogger, blogging, feed, news, google
Original post by Nick La
Technorati Tags: blog, blogger, blogging, feed, news, google
In the last post I talked about the design aspect of using CSS3 @font-face, today I would like to extend this topic to the technical side on implementing custom web fonts. So what are the options for implementing web fonts? I’m going to review the three main methods of incorporating @font-face and explain the pros […]
Advertise here with BSA
Technorati Tags: blog, news
Original post by Nick La