Posts Tagged “html”

My most recent title on Lynda.com is about creating search engine friendly sites. In the title, I demonstrate how to optimize sites that contain heavy amounts of Flash content. I’ve written about Flash SEO here, as well as on InsideRIA, and also wrote a book called Search Engine Optimization for Flash (for those of you who want detailed info on Flash SEO).

One issue in my Lynda title is that the examples worked in Safari and not FireFox (I fixed that by the way, and the new files/movies should be on the Lynda site now, or very soon). The problem actually had nothing to do with Flash- it was a FireFox issue regarding the way the browser handles CSS percentages. Because of the issue, FireFox was not rendering the Flash content or the alternate content I set up. Not cool.

Here’s the solution- FireFox needs to have percentages setup for every parent element of the element that is to use CSS percentages. So if <div id=”flashContent”> is inside of <div id=”someOtherDiv”>, and you want the flashContent div to take up 100% of the browser window, you have to set someOtherDiv to be 100% as well, along with the element(s) that div is in (maybe just the body tag, for example), and the html tag. Here’s an example of the CSS rule you’d need to use:

html,body,div#someOtherDiv,div#flashContent {
width:100%;
height:100%;
}

So remember, when you’re using percentages for an element in CSS, always also use percentages for each of that elements parents, all the way up through the html tag.