Skip navigation.

Posts tagged with "css"

Help! CSS

, , , ...


This is how this blog should look:

screenshot of this blog with Mac Internet Explorer 5.2.3
Screen shot of this blog with Firefox 1.0.7.


...and this how it looks in Internet Explorer 5.2 for Mac:

screenshot of this blog with Firefox
Screen shot of this blog with Internet Explorer 5.2.3. for Mac Os X.




No title and the sidebar has no background nor any font setting!
This is a bit too much. Not mentioning the colors which look dirty.

I know it not easy to make a liquid layout, with the least hacks, which will looks OK in most browsers, and that IE is a major problem for CSS. It's getting better from what I heard but their will be no updates for Mac Os X.

I saw to a photographer friend who uses Mac OS X the other day. I peeped over his shoulder while he was surfing... And he was USING INTERNET EXPLORER!!!
What can I say. For somebody who doesn't do web pages and is not aware of the actual problems, I had to explain him what advantages he had using an other browser: TABS!
That made him change. But that means that even people "sensitive" to visual aesthetics hasn't noticed that some of the pages which look bad are not done on purpose.

So I had to check what this blog looked like. Before I didn't care about IE users, a bit because I thought they weren't in the same field, but no some ARE.

If you know or see a way to do some fixing this, PLEASE HELP.




Me too sometimes I fell like: Instant Badger ;D




CSS3 Color Module

,

I Just put this here so I can remember to check feather.


The advantage of HSL over RGB is that it is far more intuitive: you can
guess at the colors you want, and then tweak. It is also easier to create
sets of matching colors (by keeping the hue the same and varying the
lightness/darkness, and saturation)

The algorithm to translate HSL to RGB is simple (here expressed in ABC [ABC] which was used to generate the
tables.) In these algorithms, all three values (H, S and L) have been
normalized to fractions 0..1:

    HOW TO RETURN hsl.to.rgb(h, s, l):
SELECT:
l<=0.5: PUT l*(s+1) IN m2
ELSE: PUT l+s-l*s IN m2
PUT l*2-m2 IN m1
PUT hue.to.rgb(m1, m2, h+1/3) IN r
PUT hue.to.rgb(m1, m2, h ) IN g
PUT hue.to.rgb(m1, m2, h-1/3) IN b
RETURN (r, g, b)

HOW TO RETURN hue.to.rgb(m1, m2, h):
IF h<0: PUT h+1 IN h
IF h>1: PUT h-1 IN h
IF h*6<1: RETURN m1+(m2-m1)*h*6
IF h*2<1: RETURN m2
IF h*3<2: RETURN m1+(m2-m1)*(2/3-h)*6
RETURN m1




>

CSS Test: My 1st JavaScript + transparency

, ,

CSS transparency test: here

This idea came from the CSS fixed position. I needed a "follow mouse y coordinate" script and I'm no good in JavaScript, I tried to write one myself and gave up when found out that I could tweaked a script from javascriptkit worked. (It's becoming a bad habit!)


These are the different transparency rules I have found:

/* standard css opacity rule: */

opacity: 0.5

/* for Gecko Browsers: */

-moz-opacity:0.5

/* for Konquerer and Safari: */

-khtml-opacity:0.5

/* for IE: */

filter:alpha(opacity=50)


Most browsers won't understand the standard rule for transparency : opacity:0.5.(yet? I hope)
The problem: Either the hightlight block follows the cursor and you won't be able click on a link so it has to be a bit above or below.

This test has been tested it in Firefox, Opera and Safari, dosn't work in Mac IE which is normal. But I don't know if it will work for other browsers in Windows. If it doesn't work please let me know, comments are welcome.


Here's the test: CSS3 and Javascript screen reader test




Download Opera, the fastest and most secure browser