bloggie blog » CSS

Safari CSS bug

Kevin — Thu, 21 Apr 2011 18:02:32 +0000

Safari 5.0.5 breaks some CSS on my site, involving a floating div with a p tag assigned the style text-align: right.

Anybody else seeing this? I’m assuming it’s a bug, but maybe they’re now adhering more strictly to previously overlooked standards? There’s no mention on the interwebs of this bug that I can see….

Quick improvement to Actors Access

Kevin — Fri, 06 Aug 2010 17:45:08 +0000

Attention, actors. Previously, I showed how to make IMDb Pro better if you use Safari on an Apple computer. Today, let’s add one more line to overcome.css to improve Actors Access.

The first time you use Actors Access, it’s good to see the message at the top of each breakdown that begins with, “SUBMISSION INSTRUCTIONS ALWAYS SUBMIT ASAP!!! Submitting within the first day….” But that large message gets old fast! That message just gets in the way after a while. Here’s some CSS you can use to tell Safari to hide the message:

div.alert[id=message] { display: none; }

I’ve modified my online copy of overcome.css to include this plus the previous IMDb Pro fix. Download and enjoy! (Need help on this? Just leave a comment.)

Now, if anybody can figure out how to do this on Safari iPhone, too, please let me know!

Quick fix for IMDb Pro printing

Kevin — Fri, 23 Jul 2010 22:52:48 +0000

Recently, IMDb Pro did a small redesign. Quick review: Looks better in browser, prints horribly.

I offer herein a quick fix to the printing problem, at least in Safari / Mac OS X. (Other browsers should have similar solutions for the savvy web user.)

Create a file named something.css and store it on your hard drive wherever you want. I call mine “overcome.css” and put in a my Documents folder. Edit this file with a plain-text editor. Do not use Word. Put this text, this CSS code, into that file, then save it and close it:

@media print { #nav-wrapper { display: none; } }

(Alternate solution if plain-text editing is beyond your computer routine: download overcome.css.)

Now in Safari, go to Safari > Preferences > Advanced. Where it says Style Sheet, select the file you just created or downloaded. That’s it! See the difference below, where I offer a side-by-side comparison of the first printed page of my IMDb Pro page. Quick review: Better. Way better. IMDb should hire me.

UPDATE: It turns out that Safari users will benefit from one other CSS change, due to poor cross-browser issues with the new IMDb Pro look. Add this to overcome.css in order to avoid the weird thing that happens where the page shifts down 21 pixels just as it finishes rendering. I’ve altered the download file accordingly.

#nav-wrapper #navbar { margin: 0 !important; }

Again, IMDb should hire me.

(Please leave a comment if you find it useful, or if you find an error.)