Guess (lauren) wrote in component_help,

  • Mood:

CSS Hacks on LJ?

Ok, I know this is giong to sound a bit odd, but I'm having a problem with some browser compatibility issues when it comes to my CSS. Now, normally, this wouldn't involve LJ specifically, but in order to make view my layout properly in many different browsers (both Windows & Mac), I had to employ some simple CSS hacks to target browsers, specifically Safari. I'm not using any hacks that involve JavaScript or @import or anything, just little things in the sheet itself.

The hack I'm using is a simple one that targets Safari using :only-child with selectors. Essentially, I'm running a test version of the CSS that looks like the following:

.test { color:red; }
.test:only-child:empty, .test:not(:only-child):empty { color:green; }

All of this is in the external stylesheet. However, Safari isn't playing when it comes to LiveJournal. See, if you're using Safari as a browser, any text with the class "test" should be green, but that doesn't work in LJ (it works on any other site). I've checked the CSS file that LJ actually links when you view the source of the page, and I don't see anything that indicates that the CSS was actually stripped (there's no message at the top either that says Clean CSS or whatever). So, what's going on? I've tried adding the !important rule, but that doesn't work either.

If there is no way to actually target Safari through this method, is there another CSS hack that I could use to accomplish this? The issue I'm having specifically involves relative positioning discrepencies in Windows vs. Mac (Firefox, IE in Windows display differently than Safari, Firefox in OS X).

  • Post a new comment


    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened