Forum Moderators: not2easy

Message Too Old, No Replies

Need IE5 for Mac Help

Should be Simple, But

         

MsDetta

3:38 am on Jul 14, 2004 (gmt 0)

10+ Year Member



I'm at my wits end with this tableless layout. Since I don't have access to a Mac, I can't fiddle and check what is throwing it off. Design (with a few hacks) works in IE6, NN4, NN6, NN7, Safari, Opera, Firefox on Mac and PC. I've even added a hack to import a stylesheet just for IE5 Mac, but need to know what's causing the choke.

General layout is:

____body___________________________________
¦ container________________________________¦
¦ ¦ ¦menuholder__________________________¦ ¦
¦ ¦ ¦......................¦float img rt ¦ ¦
¦ ¦ ¦menu1 under float.....¦.............¦ ¦
¦ ¦ ¦img under float.......¦.............¦ ¦
¦ ¦ ¦menu2 under float.....¦.............¦ ¦
¦ ¦ ¦closed menuholder.....¦.............¦ ¦
¦ ¦ ¦______________________¦.............¦ ¦
¦ ¦ ¦testclass.............¦_____________¦ ¦
¦ ¦ ¦ h1.................................¦ ¦
¦ ¦ ¦ h2.................................¦ ¦
¦ ¦ ¦ p..................................¦ ¦
¦ ¦ ¦ ¦quote left float¦ p...............¦ ¦
¦ ¦ ¦ ¦________________¦ more of p.......¦ ¦
¦ ¦ ¦ rest of p..........................¦ ¦
¦ ¦ ¦ ¦footer............................¦ ¦
¦ ¦ ¦ ¦close footer______________________¦ ¦
¦ ¦ ¦close testclass_____________________¦ ¦
¦ ¦close container_________________________¦
¦close body________________________________¦

Problem is that IE5 Mac is ignoring the positioning for the left-floated quote and is placing it on top of the h1 statement. IE5 Mac is also not displaying the right- floated image in the menuholder, but I can live without it displaying the image.

Since the CSS is rather long, I hate to post all of it here. Thanks in advance :)

[edited by: SuzyUK at 9:51 pm (utc) on July 14, 2004]
[edit reason] see charter [WebmasterWorld.com] [/edit]

MsDetta

12:39 am on Jul 15, 2004 (gmt 0)

10+ Year Member



Here's the pertinent sections of the bells & whistles CSS code:

html {
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
margin: 0px;
padding-top: 0px;
font-size: 100%;
text-align: center;
}
body {
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
margin: 0px!important;
padding-top: 0px;
background: #B5CDBF;
font-size: 100%;
width: 100%;
text-align: center;
}
#container {
border: 10px solid #B5CDBF;
padding: 0px;
color: #000000;
margin-left: auto;
margin-right: auto;
display: block;
text-align: left;
z-index: 300;
background: url(images/cci_logo.jpg) #B5CDBF no-repeat left top;
width: 760px;
position: relative;
}
a.byspec {
float: right;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 8pt;
color: #000000;
text-align: right;
padding-right: 15px;
text-decoration: underline;
}
#menuholder {
clear: both;
margin: 0px;
padding: 0px;
margin-left: auto;
margin-right: auto;
width: 750px;
max-width: 750px;
position: absolute;
}
#menuholder .imgrt {
margin: 0px;
padding: 0px;
float: right;
width: 135px;
margin: inherit;
top: -210px!important;
position: relative;
z-index: 300;
}
/* fix for IE6 PC */
*html #menuholder .imgrt {
left: 3px;
}
#menuholder #nav {
z-index: 2;
margin:inherit;
padding: 0px;
float: left;
text-align: left;
font-family: Arial, "Tahoma", Helvetica, sans-serif;
font-size: 9pt;
padding-top: 2px;
background: #3D6A53;
border-top: 2px solid #B5CDBF!important;
border-bottom: 44px solid #EBFFF3!important;
line-height: 2;
width: 750px;
max-width: 750px;
}
.shftl {
padding-left: 120px;
}
#nav a.menu {
clear: both;
margin: inherit;
background: #B5CDBF;
padding-right: 5px;
padding-left: 5px;
padding-top: 6px;
padding-bottom: 2px;
font-weight: bolder;
text-decoration: none;
position: relative;
letter-spacing: 1px;
line-height: 1.5;
}
/* fix for IE6 PC */
*html #nav a.menu{
top: -1px;
}

.padimg {
padding-left: 135px;
position: relative;
border-bottom: 2px solid #3D6A53!important;
border-top: 2px solid #3D6A53!important;
border-left: none;
border-right: none;
text-align: center;
}
/* fix for IE6 PC */
*html .padimg {
left: 135px;
}
#nav a.menu2 {
background: #B5CDBF;
padding-right: 5px;
padding-left: 5px;
padding-top: 4px;
padding-bottom: 5px;
font-weight: bold;
text-decoration: none;
position: relative;
letter-spacing: 1px;
line-height: 1.5;
}
/* fix for IE6 PC */
*html #nav a.menu2 {
padding-bottom: 4px;
}

/* Fix for Mozzie browsers */
.testclass{
-moz-box-sizing: border-box;
box-sizing: border-box;
display: block;
background: #EBFFF3;
width:750px;
max-width: 750px;
top: 155px;
left:0px;
position: relative;
border:0px solid #EBFFF3;
border-top:10px solid #EBFFF3;
z-index: 10;
height: auto;
}
h1, h2, h3, h5, h6, p, ul {
padding-left: 4%;
padding-right: 4%;
}
p {
text-align: left;
font-family: "Trebuchet MS", "Tahoma", Helvetica, Arial, sans-serif;
font-size: 1em;
}
.quote {
clear: both;
margin: 10px 20px 10px 25px;
float: left;
width: 200px;
color: #3D6A53;
background: #FFFFFF;
border: solid #3D6A53;
border-width: 5px 0;
padding: 5px 5px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
font-weight: bold;
}
#footer {
background: #B5CDBF;
color: #3D6A53;
text-align: center;
font-size: 0.9em;
z-index: 10;
width: 750px;
border-left:1px solid #B5CDBF;
padding-top: 10px;
}

I hope that one of you can help me figure this out for IE5 Mac. Thanks!