Browsing articles tagged with "cross-browser Archives | april.holle.blog"
Dec
1

Lots to Do This Week

I just wanted to make sure you were invited to all the awesome web and design happenings this week in Phoenix!

Tues, Dec 4th – Refresh Phoenix

Refresh Phoenix meets every first Tuesday of the month to discuss current internet issues and trends. The topics range from becoming your own boss to css frameworks to make your work more efficient. This month the topic is results from the 2007 Web Design Survey that was put out by A List Apart. This should be a very interesting conversation since there really has never been a survey of the internet industry.

When: Tuesday, December 4th 6:30 – 9:30 pm (come early to get some networking in)

Where:
Inza Coffee
8658 East Shea Blvd, Scottsdale

Fri, Dec 7th – 16th Annual AIGA Art Auction

AIGA Arizona is holding it’s annual Art Auction event in Downtown Phoenix at MonOrchid Studios during December First Friday! AIGA Arizona is pleased to present over 100 original works of art (paintings, mixed media, photography, digital art, sculpture, jewelry, and more) displayed on sale in live and silent auction formats. Plus bid on a selection of special packages that include dining, entertainment and recreation. This year’s art auction will also feature the Mohawk Show.

When: Friday, December 7th 6-10 pm

Where:
MonOrchid Studios
214 E. Roosevelt Street, Phoenix

Sat, Dec 8th – BarCamp Phoenix

BarCamp is an ad-hoc un-conference born from the desire for people to share and learn in an open environment. It is an intense event with discussions, demos and interaction from attendees. All attendees must give a demo, a session, or help with one. This is great because you can both speak and be an audience member.

When: Friday, December 8th 9 am – 5 pm

Where:
University of Advancing Technology (UAT)
2625 W. Baseline Road, Tempe

Nov
25

Blue Beanie Day: Celebrate Web Standards

Celebrate web standards by donning a blue beanie Monday, November 25 and while you’re at it, take a picture and post it to the flickr group. This event was brainstormed by Facebook group formed around Designing With Web Standards. The book was written by Jeffrey Zeldman who is well known for his and talks around the world regarding standards compliance. See his two cents on the event.

Nov
5

Refresh Phoenix: Blueprint CSS

Come on over to Inza Coffee House tomorrow night to join me and the crew of Refresh Phoenix as we discuss Blueprint CSS.

Blueprint is a CSS framework by Olav Bjorkoy, which “aims to cut down on your CSS development time.” Matt Heidemann & Matt Gist from Integrum Technologies will talk about their recent work with Blueprint. They’ll show examples of the framework and a project they recently used it with.

See ya there!

Oct
26

sIFR 3.0 Inline

Recently we’ve completed four sites for Civigroup Companies. Within those sites you’ll notice several instances of sIFR (flash replacement text) inline with content. This is no easy task for sIFR text.

While trying to accomplish this feat of magic, I spent quite a bit of time researching different aspects of sIFR and how it works with CSS to understand how to make this work properly and of course, all while being cross browser compliant! So, in order to perhaps save someone else the time and hassle of trying to figure out the magic equation, I figured I’d share my experience.

Step 1: set the sIFR class on a span tag where you want the text to be.

<span class="h1inline" style="width: 325px;">Heritage. Commitment. Vision.</span>

Notice the width style attribute, this is required to make sure safari does not include extra space behind the span and before the rest of the copy.

Step 2: set the attributes in the sIFR-screen.css sheet to make it an inline block element along with the rest of your styles.

height: 25px;
display: inline-block;
overflow: hidden;

Notice the display: inline-block; this is also a safari required attribute.

Step 3: Tune height if necessary in the sifr-config.js

tuneHeight: '-5'

This will help if you plan no not only having your sIFR text inline, but also a link. I was having difficulties with the underline of the hover state being cut off by the flash doc.

 And viola you have sIFR text inline!

Oct
10

Print Style Sheets and ASP.Net Themes

I’ve been researching printable style sheets, and came up with an issue on Terralever.com. How to make the theme stylesheets have a media type!

So I did some side research and came up with the most common answer out there: set an @media type in the css file itself. Read an article regarding @media type.

There was also an interesting article by the same author regarding how to define a particular load order.

This works GREAT for print stylesheets, but what about when we want to do IE6 specific styles? What then! If you’ll notice, when you set a theme, the stylesheet it populates at the end of the header tag, which would overwrite any specific stylesheets we would reference above it.

If we declare themes in the @ page declaration using StyleSheetTheme instead of just Theme the document is then populated with the css stylesheets at the beginning of the head declaration instead of at then end. More information regarding this and other theme and skin information. This would allow us to create javascript that would check for browser type/version and specify additional stylesheets for these versions if required.

What is this?

This little blog happens to be the personal ramblings of one April Holle - I'm female, outspoken, webbie, a community evangelist, and Principal of Made Better Studio. Check out the about section for more info.

What People Are Saying…