Posts Tagged ‘css3’

Windows 8 mail app and the background-size CSS property

Recently I discovered the Windows 8 mail app (Touch/Metro) not playing nice with the background-size CSS property. This property is often used when you need scale down an image on the fly, one reason for doing this is for optimising image assets for high resolution devices. The Windows 8 mail app supports CSS3 and hence this can be done. However background-size doesn’t actually work in some cases and its all dependant on the way you write background CSS properties. Find out more on how to avoid this quirk below!

(more…)

Windows Phone DOES support CSS3 Media Queries in HTML email

Being a Windows Phone user I felt compelled to share some recent discoveries regarding HTML email and Windows Phone. If your in the HTML email game you’ll probably know about great sites like Campaign Monitor, Litmus, Email on Acid etc. that provide resources and documentation on how to create cross compliant email templates and how to target mobile devices. One area I have noticed that is lacking information, is Windows Phone and specific information on its support for CSS3 and Media Queries. In fact, some of the information out there is no longer accurate, thanks to a few recent new discoveries.

(more…)

Multi Columned Layouts in CSS3

It’s been a while since my last CSS3 post/tutorial but that doesn’t mean I haven’t been following the development of CSS3. I have been looking at some of the newer features that have recently been implemented and one that’s caught my eye is the multi column layout module. You can already guess what this module can do. Thats right it creates columns! Using the new column module it allows you to create columns in the form of a newspaper style column. News websites and blogs rejoice! Lets take a look at how we can create columns with the new module.

(more…)

The Shadow effect in CSS3

Shadow in website design is something that can be achieved by using CSS and images, to achieve shadow in CSS2 you would use images and positioning, it can be achieved but it usually means that you have to create multiple divs. See my tutorial of creating shadow in CSS2 but one of the exciting new attributes in CSS3 is box-shadow which allows someone to get a nice shadow effect with just using one attribute applied to a div.

(more…)

Rounded Corners in CSS3

strong>Since it’s been snowing in Nottingham today and I’ve come down with a cold, I’ve been staying indoors, Although during College, all of us have been playing in the snow (Don’t judge, we’re all still young at heart!) but I’ve been playing around with the rounded corners effect in CSS3, now in my article Getting ready for CSS3 I listed a few major additions that CSS3 will bring to the web, I mentioned Shadows, multiple backgrounds and some more, but another great addition in CSS3 will be rounded corners.

(more…)