Mac incompatibility with CSS CSS Question

Question Mac incompatibility with CSS ( SitePoint Forums CSS )
Updated: 2008-11-23 05:20:01 (3)

Mac incompatibility with CSS

I do not have a mac, but a friend of mine checked out my site and they reported that they can only see my top banner/logo. The rest is blank.

URL: http://www.cyberiansolutions.com

Anyone have any ideas why this is? I know that macs are not "incompatible" with CSS, but it's surely posing a problem in my case.

(mods - i posted this in the "accessibilty" forum also, but realized it really belongs here. sorry.)

Answers: Mac incompatibility with CSS ( SitePoint Forums CSS )

Mac incompatibility with CSS

Hi,

Quote:

Would you mind explaining what the "* > html" means? Specifically, what the "*" is for

The * is the universal selector (like a wild card) and is a way of specifying a style for all selectors

Code:

* {color:black !important}

This would make all elements color=black.

However ie has a bug and recognises * html when it shouldn't because html isn't a child of anything.

Read more about it here.

http://www.info.com.ph/~etan/w3panth...ifiedsbmh.html

This is useful because ie is the only browser that makes this mistake so we can safely use it to pass values to ie only without upsetting anybody else.

IE mac understands the child selector (>) and ie pc doesn't so by combining the child selector with the universal selector we have a mechanism for addressing ie mac directly.

As much as I hate hacks they do seem to be a necessary evil

Paul

Paul O'B

Mac incompatibility with CSS

Thank you Paul - huge help as always. I'll give it a shot on Monday.

Would you mind explaining what the "* > html" means? Specifically, what the "*" is for.

cyberian

Mac incompatibility with CSS

Hi,

I checked your site in netscape 7 in a mac and it seemd ok.

In mac ie 5.1 you have some display issues and I have adjusted your css (in bold below) which should sort some of them out.

Mac doesn't like html,height:100% as it seems to double the height so you need to hide it from mac.

As it won't place the footer you need to put the footer back in the flow. It also didn't like your floated login input so I changed that as well and the layout seemed better.

These changes have all been give to mac ie only so no other browsers should be affected.

Code:

/* commented backslash hack v2 \*/ 
html, body{height:100%;} 
/* end mac hack */ 
 
body {
  margin: 0;
  padding: 0;
  font: 10px verdana, Lucida Sans Unicode,   lucida ,arial, sans-serif;
  text-align: center;
  color: #666;
  background-color: #e3e3e3;
  height:100%;
  }

Code:

#footer {
  width: 100%;
  height: 20px;
  background: #005088 url(/images/footer.gif);
  border-top: 1px solid #e9e9e9;
  position: absolute;
  bottom: 0;
  z-index: 2;
  }
* > html #footer {position:static}

Code:

#clientlogin input {
  border: 1px solid #e6e6e6;
  font: normal 10px/14px verdana, Lucida Sans Unicode, lucida , sans-serif;
  background: #ffffff;
  color: #999;
  width: 100px;
  height: 14px;
  float:left;
  }
* > html #clientlogin input {float:none}

Hope that helps.

Paul

Paul O'B

- Source: Mac incompatibility with CSS SitePoint Forums CSS
- Previous Question: View more smilies phpBB phpBB 3.0.x 3.0.x Support Forum
- Next Question: Modifying Emails phpBB phpBB 3.0.x 3.0.x Support Forum