CSS, JavaScript and XHTML Explained

Win a Free Ticket to CSS Summit, the online CSS Conference July 18, 2010

Win a free ticket to the online CSSSummit. Follow @estellevw on Twitter, and Tweet, facebook or blog that you want to go. Something like ““I wanna go to attend the online http://csssummit.com. Follow @estellevw and retweet to win: http://awe.sm/58Uxr” will work fine.

Can wait to sign up? Register at http://csssummit.com.

I am very excited to be presenting at the 2nd Annual CSS Summit with some of the best speakers working with CSS today and a list of topics on the cutting edge:

• Zoe Gillenwater, author of Stunning CSS, presents “CSS3 Techniques”
• David McFarland, author of CSS: The Missing Manual, presents “CSS3 Animations”
• Stephanie Sullivan, author of Mastering Dreamweaver and CSS, presents “CSS3 and Progressive Enhancement”
• Jason Cranford-Teague, author of Fluid Web Typography, presents “CSS and Web Typography”
• Denise Jacobs, author of The CSS Detective Guide, presents “Advanced CSS Troubleshooting”
• Estelle Weyl, that’s me!, author of Beginning iPhone Web Apps, presents “CSS3 and iPhone Development”
• Chris Eppstein, creator of CSS Compass framework, presents “CSS with SASS, SCSS & Compass”
• Nicole Sullivan, curator of the Object Oriented CSS framework, presents “CSS and Optimizing Facebook”

Tell them Estelle sent you. Use discount code “CSSWEYL” for 10% off the 2nd Annual CSS Summit!

Join us for what is sure to be a great day of knowledge and insight with some of the Web’s leading experts in CSS.

There will be free recordings of the CSS Summit for all attendees. The online event is content-rich and allows for plenty of time for interaction with the speakers, but sometimes life gets in the way. They’ve upgraded their online conferencing software—now you can view (and review) recordings of the 2nd Annual CSS Summit at your own convenience in case work, vacation or nature calls, or in case we cover something that is new to you and you need to re-watch to fully grasp.

2nd Annual CSS Summit July 15, 2010

I am very excited to be presenting at the 2nd Annual CSS Summit with some of the best speakers working with CSS today and a list of topics on the cutting edge:

• Zoe Gillenwater, author of Stunning CSS, presents “CSS3 Techniques”
• David McFarland, author of CSS: The Missing Manual, presents “CSS3 Animations”
• Stephanie Sullivan, author of Mastering Dreamweaver and CSS, presents “CSS3 and Progressive Enhancement”
• Jason Cranford-Teague, author of Fluid Web Typography, presents “CSS and Web Typography”
• Denise Jacobs, author of The CSS Detective Guide, presents “Advanced CSS Troubleshooting”
• Estelle Weyl, that’s me!, author of Beginning iPhone Web Apps, presents “CSS3 and iPhone Development”
• Chris Eppstein, creator of CSS Compass framework, presents “CSS with SASS, SCSS & Compass”
• Nicole Sullivan, curator of the Object Oriented CSS framework, presents “CSS and Optimizing Facebook”

Tell them Estelle sent you. Use discount code “CSSWEYL” for 10% off the 2nd Annual CSS Summit!

Join us for what is sure to be a great day of knowledge and insight with some of the Web’s leading experts in CSS.

There will be free recordings of the CSS Summit for all attendees. The online event is content-rich and allows for plenty of time for interaction with the speakers, but sometimes life gets in the way. They’ve upgraded their online conferencing software—now you can view (and review) recordings of the 2nd Annual CSS Summit at your own convenience in case work, vacation or nature calls, or in case we cover something that is new to you and you need to re-watch to fully grasp.

New Browser Releases: Opera 10.6 and Firefox 4beta July 7, 2010

Since I last wrote in this blog (the day Safari 5 was released), two more browser versions have been released. Opera 10.6 was released last week, with fabulous support for webforms, though still no support for the placeholder attribute.

Yesterday, Firefox 4 Beta was also released, in beta (duh!). They added a feedback button to enable easy feedback submisstion. Smart, since few will go out of their way to provide feedback, but they make it so easy that you can’t help but provide feedback if you find a quirk. I kind of wish Opera had that feature. And kind of wish Firefox didn’t.

Removing the Firefox Feedback Button

Removing the “Feedback” button is actually beyond easy. It’s simply an addon. And, since Firefox 4 beta is basically incompatible with all other addons, it’s the only one listed that you can disable.

To disable it, click on Tools > Add Ons. A new browser window entitled “Add-Ons Manager” will open with a list of all of your addons. The only one that is not disabled is the “Feedback 10rc1″ addon. Click on the “disable” button, and restart Firefox.

I thought that Firebug was going to be native in FF4, like Opera comes with DragonFly and Safari comes with Developer ToolBar, even Chrome and IE8 have an equivalent of Firebug, but Firefox 4 does not, and Firebug is not compatible. Because Firebug is not compatible with FF4 make sure to enable saving your current version of Firefox before downloading the new Beta.

While Firefox 4beta adds an HTML5 parser and full support for web video, audio, and drag & drop, there has been precious little improvement in Web Forms support. Similar to Safari 5, the beta release has removed some support from :link and :visited. In über cool fashion, it has added support for a non-spec CSS selector :-moz-any(), which basically allows you to say “pick any of these descendent selectors of this parent selector”, instead of having to write out the parent selector in front of every single of its descendants that you want to match separately separated by commas… that always gets long. Since we still have to write the longhad of the selectors for other browsers, unless this selector idea catches on and is added to the spec, it will be useless except for use as a hack to target Firefox 4.

Another added feature in FF4 beta is the CSS calc() value. Useful for when you want to define width of 100% on an element with padding, or when you want to ensure there is a fixed width gutter on a fluid layout, width: -moz-calc(25% - 15px); can help ensure that gutter.

By the way, why are you reading this blog? I’ve moved over to www.standardista.com. It’s prettier, more thorough, and even more interesting over there.

Opera

With Opera it’s almost easier to say what it doesn’t support, since they’re doing such a great job of supporting modern draft standards.

Opera supports all of the new input types except tel, color and search, but since they support pattern matching, you can enter your own pattern. Unfortunately the placeholder and multiples attributes are not yet supported. When placeholder is supported, the lack of support for tel since there is support for pattern may be almost a non-issue.

Definitely download Opera and take Dragonfly, their version of Firebug, for a spin. Not new to 10.6, but still very cool.