I found this interesting presentation about Responsive Design created by ecentricarts, a canadian web agency.
The presentation explains what’s Responsive Design, how to approach it, available tools and more.
Tag Archives: css
CSS Border Radius Generator
CSS Border Radius Generator is a web service by Jacob Bijani
CSS Prettifier & Optimiser
It’s always a good practice to clean and to optimise your CSS. There are a lot of websites that offer these services, I searched and I found the best 2:
Scrolling in IOS 5
The CSS property “overflow” lets you made scrollable the content inside an element. It adds the native OS’s scrollbar in almost all browsers except with IOS.
To do it you just need to use these two simple lines:
Create an Image Stack Illusion Tutorial
I found on Design Shack an interesting tutorial about creating an image stack illusion:
Use Pseudo Elements to Create an Image Stack Illusion | Design Shack.
CSS: text shadows
If you need to use text shadows CSS property I found this useful webpage that explains how to use it with different examples. The website is made by W3C.
CSS3 Shapes Resource
Surfing the web I found CSS3 Shapes, an insteresting website that gives you some examples of shapes created with CSS3.
The examples are easy to copy and paste wherever you want.
Tips for Making Website iPhone and iPad Frendly
In the latest days I worked on websites optimizations for iPhone and iPad. I found some tips that can be useful and I want to share it.
PHP detecting
You can detect if the device viewing your site is an iPad, iPhone or iPod using this code:
CSS3 Gradient Generator
CSS3 Gradient Generator it’s a simple website that let you generate gradient color to use in your site.
You can change two color and automatically will be generate your gradient, letting you choose the gradient direction.
The code generated is supported from the most used browser, it gives you different instructions for the differents browsers.
Responsive Web Design – CSS Media Queries
HTML4 and CSS2 currently support media-dependent style sheets tailored for different media types. For example, a document may use sans-serif fonts when displayed on a screen and serif fonts when printed. ‘screen’ and ‘print’ are two media types that have been defined. Media queries extend the functionality of media types by allowing more precise labeling of style sheets.
A media query consists of a media type and zero or more expressions that check for the conditions of particular media features. Among the media features that can be used in media queries are ‘width’, ‘height’, and ‘color’. By using media queries, presentations can be tailored to a specific range of output devices without changing the content itself.