[SOLVED] image repeating / double up'd

Humpty · August 21, 2008

[update: I had to upload it for someone else to view, so it's online now here: http://www.lodi.com.au/ppearl/ ]

G'day Guys,

Sorry I couldn't be more specific in the subject, I also haven't search the boards as I have no idea what the problem is to search for in words.

Below is the CSS that I am using, and a breif mock, up of the HTML that is in place and using it.

What is happening is that I have an image at the bottom right of my page, which i have set as attchment fixed, (unsure if that is correct thing to do but it worked).

however I am finding that it is being somehow carried through on / in another table. It looks good as one or the other but when it appears on both it sucks and looks ugly. I can get it online for you to view if required withing a few minutes of being requested.

CSS:

.MainTable{

background-image: url(../newimg/backing_top_left.jpg);
background-repeat: no-repeat;
background-position: left top;
}
.TableHeader{
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 80%;
color: #666666;
background-image: url(../newimg/backing_header_backing.jpg);
background-repeat: repeat-x;
background-position: left top;
    filter:alpha(opacity=90);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);
    -moz-opacity: 0.90; opacity:0.90;
    border:0px none;
    z-index: 1;
}

.RealTable{
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: x-small;
color: #000000;
margin: 0px;
width: 750px;
background-color: #FFFFFF;
border: 2px solid #000000;
filter:alpha(opacity=60);

    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
-moz-opacity: 0.60;
opacity:0.60;
z-index: 1;
}
html, body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 80%;
color: #666666;
background-image: url(../newimg/backing_bottom_right.jpg);
background-repeat: no-repeat;
background-position: right bottom;
background-color: #D8D6DB;
background-attachment: fixed;
}

Mock up of html:

(the html at this stage was small enough so i have actually copied and pasted instead of a mock up

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" media="screen" href="css/styles.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>


</head>

<body>
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="MainTable" >
  <tr>
    <td colspan="3">      <table width="100%" height="103" border="0" cellpadding="0" cellspacing="0" class="TableHeader">
        <tr>
          <td> </td>
          <td> </td>
          <td> </td>
        </tr>
        <tr>
          <td> </td>
          <td> </td>
          <td> </td>
        </tr>
        <tr>
          <td> </td>
          <td> </td>
          <td> </td>
        </tr>
            </table></td>
  </tr>
  <tr>
    <td> </td>
    <td align="center"> </td>
    <td align="center"> </td>
  </tr>
  <tr>
    <td> </td>
    <td align="center"><table width="200" border="0" cellpadding="0" cellspacing="0" class="RealTable">
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      
    </table></td>
    <td align="center"><p> </p>    </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
</table>
</body>
</html>

any help would be great even if it is a push in the right direction.

Humpty · September 5, 2008

?? bump ??

Sign In

[SOLVED] image repeating / double up'd

Recommended Posts

Humpty

Link to comment

Share on other sites

Humpty

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information