Newbie need help - background graphic inside table

  • tran006
  • Born
  • Born
  • tran006
  • Posts: 1

Post 3+ Months Ago

Hello all,

Im a graphic designer. Did a couple website using tradition html, slice graphic in firework, then export to dreamweaver. Im learning css for dreamweaver & now using it for one of the project & stuck...please hepl.

All look good in Mac (safari, firefox), except PC (internet explorer) will not display inventory page right (un-ordered list items with rollover to show dropdown menu) . Only showed one table where I had CSS dropdown menu. All other tables disappeared. Links on left work still.

Highly appreciate any suggestions or guides from the pros.

Thanks all

tran006

Here is the code


>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

<head>
<meta name="keywords" content="Antiques, Antiques Furniture, Vintage, Decorating Arts, San Diego Antiques Store, Mission Gallery, Fine Art, Estate Jewelry, Antiques Wanted, Museum, Oil Painting, Watercolor, Around The World ">
<meta name="description" content="Mission Gallery Antiques and Fine Art opened for business July 1980. Within ten years we became the destination antique store in San Diego. Always with an eye for the individual, unusual or investment grade; we understand the needs of many consumers; the Collector, the Investor and the Curious. ">
<title>Welcome to Mission Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
td img {display: block;}.indexContent {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-style: normal;
height: inherit;
width: inherit;
padding-top: 0px;
padding-right: 10px;
padding-bottom: 10
px;
padding-left: 56px;
max-width: 441px;
max-height: 217px;
page-break-before: inherit;
}
</style>
<!--Fireworks CS3 Dreamweaver CS3 target. Created Tue Apr 06 17:53:51 GMT-0700 (PDT) 2010-->
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body bgcolor="#ffffff" onload="MM_preloadImages('images/index_r3_c1r.jpg','images/index_r5_c1r.jpg','images/index_r6_c1r.jpg','images/index_r7_c1r.jpg','images/index_r8_c1r.jpg','images/index_r4_c1r.jpg')">
<table border="0" cellpadding="0" cellspacing="0" width="1024">
<!-- fwtable fwsrc="index.png" fwpage="Page 1" fwbase="index.gif" fwstyle="Dreamweaver" fwdocid = "541302511" fwnested="0" -->
<tr>
<td><img src="images/spacer.gif" width="170" height="1" border="0" alt="" /></td>
<td><img src="images/spacer.gif" width="441" height="1" border="0" alt="" /></td>
<td><img src="images/spacer.gif" width="413" height="1" border="0" alt="" /></td>
<td><img src="images/spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>

<tr>
<td><img name="index_r1_c1" src="images/index_r1_c1.jpg" width="170" height="164" border="0" id="index_r1_c1" alt="" /></td>
<td colspan="2"><img name="index_r1_c2" src="images/index_r1_c2.jpg" width="854" height="164" border="0" id="index_r1_c2" alt="" /></td>
<td><img src="images/spacer.gif" width="1" height="164" border="0" alt="" /></td>
</tr>
<tr>
<td colspan="3"><img name="index_r2_c1" src="images/index_r2_c1.jpg" width="1024" height="13" border="0" id="index_r2_c1" alt="" /></td>
<td><img src="images/spacer.gif" width="1" height="13" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="index.htm"><img src="images/index_r3_c1.jpg" alt="Home" name="index_r3_c1" width="170" height="51" border="0" id="index_r3_c1" onmouseover="MM_swapImage('index_r3_c1','','images/index_r3_c1r.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td><img name="index_r3_c2" src="images/index_r3_c2.jpg" width="441" height="51" border="0" id="index_r3_c2" alt="" /></td>
<td rowspan="8"><img name="index_r3_c3" src="images/index_r3_c3.jpg" width="413" height="463" border="0" id="index_r3_c3" alt="" /></td>
<td><img src="images/spacer.gif" width="1" height="51" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="inventory.htm"><img src="images/index_r4_c1.jpg" alt="Inventory" name="index_r4_c1r" width="170" height="38" border="0" id="index_r4_c1r" onmouseover="MM_swapImage('index_r4_c1r','','images/index_r4_c1r.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td rowspan="6"><table width="441" height="217" background="images/index_r4_c2.jpg"border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="381" class="indexContent">Mission Gallery Antiques and Fine Art opened for business July 1980. Within ten years we became the destination antique store in San Diego. Always with an eye for the individual, unusual or investment grade; we understand the needs of many consumers; the Collector, the Investor and the Curious. <br />
<br />
We strive to always display a wide variety of remarkable 18th, 19th &amp; 20th Century. American / European and Oriental Art and Antiques.</td>
</tr>
</table></td>
<td><img src="images/spacer.gif" width="1" height="38" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="specials.htm"><img src="images/index_r5_c1.jpg" alt="Specials" name="index_r5_c1" width="170" height="40" border="0" id="index_r5_c1" onmouseover="MM_swapImage('index_r5_c1','','images/index_r5_c1r.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td><img src="images/spacer.gif" width="1" height="40" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="shipping.htm"><img src="images/index_r6_c1.jpg" alt="Shipping" name="index_r6_c1" width="170" height="39" border="0" id="index_r6_c1" onmouseover="MM_swapImage('index_r6_c1','','images/index_r6_c1r.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td><img src="images/spacer.gif" width="1" height="39" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="antiqueswanted.htm"><img src="images/index_r7_c1.jpg" alt="antiques wanted" name="index_r7_c1" width="170" height="40" border="0" id="index_r7_c1" onmouseover="MM_swapImage('index_r7_c1','','images/index_r7_c1r.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td><img src="images/spacer.gif" width="1" height="40" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="contact.htm"><img src="images/index_r8_c1.jpg" alt="contact" name="index_r8_c1" width="170" height="36" border="0" id="index_r8_c1" onmouseover="MM_swapImage('index_r8_c1','','images/index_r8_c1r.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td><img src="images/spacer.gif" width="1" height="36" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r9_c1" src="images/index_r9_c1.jpg" width="170" height="24" border="0" id="index_r9_c1" alt="" /></td>
<td><img src="images/spacer.gif" width="1" height="24" border="0" alt="" /></td>
</tr>
<tr>
<td colspan="2"><img name="index_r10_c1" src="images/index_r10_c1.jpg" width="611" height="195" border="0" id="index_r10_c1" alt="" /></td>
<td><img src="images/spacer.gif" width="1" height="195" border="0" alt="" /></td>
</tr>
</table>
</body>
</html>


>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> CSS codes >>>>>>>>>>>>>>>>>>>>

@import "dropdown.css";

ul.dropdown-vertical {
width: 100px;
}

ul.dropdown-vertical ul {
width: 80px;
top: 0px;
left: 320px;
}

ul.dropdown-vertical li {
float: none;
}.categories {
font-family: Arial, Helvetica, sans-serif;
}


>>>>>>>>>>>>>>>>>>>>>

ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}

ul.dropdown {
position: relative;
z-index: 597;
float: left;
}
tr .dropdown {
list-style-type: lower-alpha;
}

ul.dropdown li {
float: left;
line-height: 0.8em;
vertical-align: middle;
zoom: 1;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
position: right;
z-index: 599;
cursor: default;
}

ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 100%;
}

ul.dropdown ul li {
float: none;
}

ul.dropdown ul ul {
top: 1px;
left: 99%;
}

ul.dropdown li:hover > ul {
visibility: visible;
}

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

ul.dropdown {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight: normal;
}

ul.dropdown li {
width: 320px;
padding: 7px 10px;

}

ul.dropdown li.hover,
ul.dropdown li:hover {
position:relative;



}

ul.dropdown a:link,
ul.dropdown a:visited { color: #000; text-decoration: none; }
ul.dropdown a:hover { color: #c00;}
ul.dropdown a:active { color: #ffa500; }


/* -- level mark -- */

ul.dropdown ul {
width: 100px;
margin-top: 1px;
}

ul.dropdown ul li {
font-weight: normal;
}



/*-------------------------------------------------/
* @section Support Class `dir`
* @level sep ul, .class
*/


ul.dropdown *.dir {
padding-right: 5px;
background-image: url(images/nav-arrow-down.png);

background-repeat: no-repeat;
}


/* -- Components override -- */



ul.dropdown-upward *.dir {
background-image: url(images/nav-arrow-top.png);
}

ul.dropdown-vertical *.dir,
ul.dropdown-upward ul *.dir {
background-image: url(images/nav-arrow-right.png);
background-position: right center;
}
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

Post Information

  • Total Posts in this topic: 1 post
  • Users browsing this forum: No registered users and 51 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.