13 Replies Latest reply: Jul 18, 2012 9:07 AM by bex43 RSS

    How do I ensure page background stays within table for different browser settings?

    bex43

      see www.londongynaeconsultancy.co.uk which shows background image which is moving dependng on which browser it it used on ... looks fine on my mac but image slips on my laptop?  Really appreciate any help?

        • 1. Re: How do I ensure page background stays within table for different browser settings?
          osgood_ CommunityMVP

          When you say your background slips can you describe what is happening?

          • 2. Re: How do I ensure page background stays within table for different browser settings?
            osgood_ CommunityMVP

            Ok I see why its 'slipping' out of position now. DON'T attach the background image to the 'body' tag css attch it to the <td> cell that you want the image to appear in.

             

            Create a new css class called .flowerImage (or whatever name you like):

             

            .flowerImage {

                background-image: url(assets/DARKERGRADlilybackground894x567.jpg);

                background-position: bottom, bottom;

                background-repeat: no-repeat;

            }

             

             

            Then attach the class to the <td> cell:

             

            <td width="894" height="563" id="flowerImage"><p class="mainbodycopy"> </p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy"><span class="mainbodycopyheader">Welcome to the London Gynae Consultancy</span></p>

            <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy">We are a medical service dedicated to all your gynaecological needs. We offer an excellent </p>

                  <p class="mainbodycopy">range of services with both English and Arabic doctors and a female gynaecologist.</p>

            <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy">Our range of servcies include the management of:</p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy">Heavy periods, fibroids, entometriosis and pelvic pain, colposcopy and smear abnormalities,</p>

            <p class="mainbodycopy">infertility and polycystic ovarian syndrome, urinary incontinence, prolapse and problems</p>

                  <p class="mainbodycopy">of the menopause.</p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy">Womens health problems are often troublesome and embarressing, interfering</p>

                  <p class="mainbodycopy">with your way of life. We understand the sensitive issues surrounding</p>

                  <p class="mainbodycopy">the gynaecological problems you may be experiencing and offer</p>

                  <p class="mainbodycopy">fully comprehensive assessments, investigations and treatments</p>

                  <p class="mainbodycopy">in a comfortable and confidential environment.</p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy"> </p>

                  <p class="mainbodycopy"> </p>

            <p class="mainbodycopy"><span class="mainbodycopyendline">Visit us </span><span class="mainbodycopyendline">to experience </span></p>

                <p class="mainbodycopy"><span class="mainbodycopyendline">medical excellence</span> <span class="mainbodycopyendline">at its best</span></p>

                <p class="mainbodycopy"> </p>

                <p class="mainbodycopy"> </p>

                <p class="mainbodycopy"> </p></td>

            • 3. Re: How do I ensure page background stays within table for different browser settings?
              osgood_ CommunityMVP

              See all those 'mainbodycopy' classes. You can get rid of those and just target the paragraph tags in the .flowerImage <td> cell by doing the following:

               

               

               

              .flowerImage p {

               

              css attributes go here;

               

              }

              • 4. Re: How do I ensure page background stays within table for different browser settings?
                bex43 Community Member

                Thank you so much you are very kind.  Unfortunately Im another humble pleb teaching myself dreamweaver very badly it would appear! ... and do not know html. I tried creating new css class attaching to td but cannot see background image unless I put it into page properties also. Still slips.  Does the background image also need to be in page properties?

                • 5. Re: How do I ensure page background stays within table for different browser settings?
                  Ken Binney CommunityMVP

                  May we please see your attempted CSS code for the td?

                  • 6. Re: How do I ensure page background stays within table for different browser settings?
                    bex43 Community Member

                    Sorry this is so long - Im not sure which bit I should be showing you!

                     

                    <!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>

                    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

                    <title>home page</title>

                    <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_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_nbGroup(event, grpName) { //v6.0

                      var i,img,nbArr,args=MM_nbGroup.arguments;

                      if (event == "init" && args.length > 2) {

                        if ((img = MM_findObj(args[2])) != null && !img.MM_init) {

                          img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;

                          if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();

                          nbArr[nbArr.length] = img;

                          for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {

                            if (!img.MM_up) img.MM_up = img.src;

                            img.src = img.MM_dn = args[i+1];

                            nbArr[nbArr.length] = img;

                        } }

                      } else if (event == "over") {

                        document.MM_nbOver = nbArr = new Array();

                        for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {

                          if (!img.MM_up) img.MM_up = img.src;

                          img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);

                          nbArr[nbArr.length] = img;

                        }

                      } else if (event == "out" ) {

                        for (i=0; i < document.MM_nbOver.length; i++) {

                          img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }

                      } else if (event == "down") {

                        nbArr = document[grpName];

                        if (nbArr)

                          for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }

                        document[grpName] = nbArr = new Array();

                        for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {

                          if (!img.MM_up) img.MM_up = img.src;

                          img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;

                          nbArr[nbArr.length] = img;

                      } }

                    }

                     

                     

                    //-->

                    </script>

                    <style type="text/css">

                    <!--

                    body,td,th {

                              font-family: Verdana, Geneva, sans-serif;

                              color: #333;

                              font-size: 16px;

                              text-align: left;

                              padding: 0px;

                              border-top-style: none;

                              border-right-style: none;

                              border-bottom-style: none;

                              border-left-style: none;

                              height: auto;

                              width: auto;

                              vertical-align: top;

                              top: auto;

                              margin-top: 0px;

                              margin-left: 0px;

                              padding-right: 0px;

                              float: 0px;

                              padding-left: 0px;

                              text-decoration: none;

                              font-stretch: normal;

                              padding-bottom: 0px;

                              padding-top: 0px;

                              margin-bottom: 0px;

                              border-right-color: #CB1269;

                              border-top-color: #CB1269;

                              border-left-color: #CB1269;

                    }

                    body {

                              background-repeat: no-repeat;

                              font-family: Verdana, Geneva, sans-serif;

                              vertical-align: middle;

                              outline-style: none;

                              height: 700px;

                              width: auto;

                              padding-top: 0px;

                              margin-top: 20px;

                              margin-left: 0px;

                              padding-bottom: 0px;

                              background-image: url(assets/backgroundunderconstr894x570.jpg);

                              text-align: left;

                              float: none;

                              border-right-color: #CB1269;

                              border-left-color: #CB1269;

                              border-right-style: none;

                              border-left-style: none;

                              border-right-width: medium;

                              border-left-width: medium;

                              margin-right: 0px;

                              background-color: #F9E2E9;

                              background-attachment: inherit;

                              background-position: center 160px;

                    }

                    .mainbodycopyheader {

                              font-family: Verdana, Geneva, sans-serif;

                              font-size: 24px;

                              color: #D9528D;

                              text-align: left;

                    }

                    .mainbodycopyendline {

                              font-family: Verdana, Geneva, sans-serif;

                              font-size: 24px;

                              color: #333;

                    }

                    .Homebodycopy {

                              font-family: Verdana, Geneva, sans-serif;

                              color: #333;

                              text-align: left;

                              border-top-style: none;

                              border-right-style: none;

                              border-bottom-style: none;

                              border-left-style: none;

                              vertical-align: top;

                              line-height: inherit;

                              margin: 0;

                              padding-right: 0px;

                              padding-bottom: 0px;

                              padding-left: 0px;

                              padding: 0;

                              margin-left: 0px;

                              border-left-color: #CC1366;

                              border-left-width: medium;

                              margin-top: 0px;

                              padding-top: 0px;

                    }

                    .HOMESUBCOPY {

                              font-size: 24px;

                              font-family: "Gill Sans";

                              color: #1C1C1F;

                              text-align: center;

                              border-top-width: thin;

                              border-right-width: thin;

                              border-bottom-width: thin;

                              border-left-width: thin;

                              border-top-style: none;

                              border-right-style: none;

                              border-bottom-style: none;

                              border-left-style: none;

                    }

                    .menubarkeylines {

                              border-top-style: none;

                              border-right-style: solid;

                              border-bottom-style: none;

                              border-left-style: none;

                              text-align: left;

                              vertical-align: top;

                              padding: 0;

                              margin: 0px;

                              float: none;

                              margin-right: 0px;

                              padding-right: 30px;

                              margin-left: 0px;

                              border-right-color: #CC006B;

                    }

                    femalegynaecolourfont {

                              color: #CC1366;

                    }

                    .femalegynaefontcolour {

                              color: #CC1366;

                              font-size: 24px;

                              text-decoration: blink;

                    }

                    .homepagebaseinfo {

                              font-size: 14px;

                              font-family: Verdana, Geneva, sans-serif;

                              color: #676C72;

                              margin: 10px;

                              padding: 10px;

                              border-top-style: none;

                              border-right-style: none;

                              border-bottom-style: none;

                              border-left-style: none;

                              bottom: auto;

                    }

                    .homepagetitle {

                              font-family: Verdana, Geneva, sans-serif;

                              margin: 0px;

                              padding: 0px;

                              border-top-style: none;

                              border-right-style: none;

                              border-bottom-style: none;

                              border-left-style: none;

                              text-decoration: none;

                              left: auto;

                              padding-bottom: 50px;

                    }

                    horizontalbar {

                              color: #CC1366;

                    }

                    .bodyheadercopy {

                              font-family: Verdana, Geneva, sans-serif;

                              font-size: 24px;

                    }

                    .arabicspeaking {

                              color: #CB006B;

                    }

                    .mainbodycopy {

                              margin-top: 0px;

                              margin-right: 0px;

                              margin-bottom: 0px;

                              margin-left: 0px;

                              padding-top: 0px;

                              padding-right: 0px;

                              padding-bottom: 0px;

                              padding-left: 0px;

                    }

                    .mainbodycopy {

                              font-family: Verdana, Geneva, sans-serif;

                              text-align: left;

                              padding-top: 0px;

                              padding-right: 15px;

                              padding-bottom: 0px;

                              padding-left: 15px;

                              text-indent: 20px;

                              float: none;

                              border-right-color: #CB1269;

                              border-left-color: #CB1269;

                              border-right-style: solid;

                              border-left-style: solid;

                              border-right-width: medium;

                              border-left-width: medium;

                              border-bottom-color: #CB1269;

                              border-bottom-width: medium;

                              border-bottom-style: none;

                              word-spacing: normal;

                              border-top-color: #CB1269;

                              margin: 0px;

                    }

                    #nav bar tr {

                              text-align: left;

                              margin: 0px;

                              padding: 0px;

                    }

                    #nav bar tr td a #homestateup {

                              display: none;

                    }

                    .tcsfont {

                              font-family: Verdana, Geneva, sans-serif;

                              font-size: 14px;

                              color: #333;

                              text-align: center;

                              border-right-color: #CC136B;

                              border-left-color: #CC136B;

                              border-right-style: none;

                              border-left-style: none;

                              border-right-width: thin;

                              border-left-width: thin;

                              border-bottom-color: #CC136B;

                              border-bottom-style: none;

                              border-bottom-width: thin;

                              border-top-color: #CC136B;

                              border-top-style: solid;

                              border-top-width: medium;

                    }

                    .Allrightsreserved {

                              font-family: Verdana, Geneva, sans-serif;

                              font-size: 14px;

                              font-weight: normal;

                              font-variant: normal;

                              text-transform: none;

                              color: #FFF;

                              text-align: center;

                    }

                    .menubarborders {

                              border-right-color: #CC136B;

                              border-right-style: solid;

                              border-right-width: medium;

                              border-left-color: #CC136B;

                              border-left-style: solid;

                              border-left-width: medium;

                              text-align: left;

                              margin: 0px;

                              padding: 0px;

                              white-space: normal;

                              clear: none;

                              float: none;

                              left: 0px;

                              top: 0px;

                              right: 0px;

                              bottom: 0px;

                              padding-right: 0px;

                              padding-left: 0px;

                    }

                    .titlebox {

                              border-top-width: medium;

                              border-right-width: medium;

                              border-bottom-width: medium;

                              border-left-width: medium;

                              border-top-style: solid;

                              border-right-style: solid;

                              border-bottom-style: none;

                              border-left-style: solid;

                              border-top-color: #CC136B;

                              border-right-color: #CC136B;

                              border-bottom-color: #CC136B;

                              border-left-color: #CC136B;

                              border-color: #CB1269;

                              padding-top: 0px;

                              padding-left: 0px;

                              top: 10px;

                              bottom: 10px;

                              padding-bottom: 0px;

                              padding-right: 0px;

                     

                     

                    .mainbodycopy {

                              border-right-style: solid;

                              border-left-style: solid;

                              padding: 0px;

                              border-right-color: #CB1269;

                              border-left-color: #CB1269;

                              border-right-width: medium;

                              border-left-width: medium;

                    }

                    .bordersnavbar {

                              border-left-width: medium;

                              border-left-style: none;

                              border-left-color: #CB1269;

                              border-right-color: #C71A6B;

                              border-right-style: none;

                              border-right-width: medium;

                              border-top-color: #C3206D;

                              border-bottom-color: #CB1269;

                    }

                    a:visited {

                              color: #CB1269;

                    }

                    .mainbodycopy1 {          margin-top: 0px;

                              margin-right: 0px;

                              margin-bottom: 0px;

                              margin-left: 0px;

                              padding-top: 0px;

                              padding-right: 0px;

                              padding-bottom: 0px;

                              padding-left: 0px;

                    }

                    .mainbodycopy1 {          font-family: Verdana, Geneva, sans-serif;

                              text-align: left;

                              padding-top: 0px;

                              padding-right: 15px;

                              padding-bottom: 0px;

                              padding-left: 15px;

                              text-indent: 0px;

                              float: none;

                              border-right-color: #CB1269;

                              border-left-color: #CB1269;

                              border-right-style: solid;

                              border-left-style: solid;

                              border-right-width: medium;

                              border-left-width: medium;

                              border-bottom-color: #CB1269;

                              border-bottom-width: medium;

                              border-bottom-style: none;

                              word-spacing: normal;

                              border-top-color: #CB1269;

                              margin: 0px;

                    }

                    a:link {

                              color: #333;

                    }

                    a:hover {

                              color: #C71A6B;

                    }

                    .backgroundimage {

                              background-image: url(assets/backgroundunderconstr894x570.jpg);

                              background-repeat: no-repeat;

                              background-position: center bottom;

                    }

                    -->

                    </style>

                    </head><body onload="MM_preloadImages('assets/menu bars/aboutusstate2over.jpg','assets/menu bars/aboutusstate3used.jpg','assets/menu bars/homestate3used.jpg','assets/menu bars/homestate2over.jpg','assets/menu bars/Theteamstate3used.jpg','assets/menu bars/Theteamstate2over.jpg','assets/menu bars/linksstate3used.jpg','assets/menu bars/linksstate2over.jpg','assets/menu bars/Contactusstate3used.jpg','assets/menu bars/Contactusstate2over.jpg','assets/menu bars/ourservicestate2over.jpg','assets/menu bars/ourservicestate2over.png','assets/menu bars/arabicstate2over.jpg')"><table width="896" align="center" cellpadding="0" cellspacing="0">

                      <tr>

                        <td width="894" height="105" class="titlebox"><img src="assets/logo/titleFINAL LOGO.jpg" width="889" height="105" alt="titlelogo" /></td>

                      </tr>

                      <tr>

                      </tr>

                      <tr>

                        <td height="32"><table width="896" height="32" border="0" cellpadding="0" cellspacing="0" class="bordersnavbar">

                          <tr>

                            <td width="909" height="30" class="bordersnavbar"><a href="index.htm" target="_top" onclick="MM_nbGroup('down','group1','home','assets/menu bars/homestate3used.jpg',1)" onmouseover="MM_nbGroup('over','home','assets/menu bars/homestate2over.jpg','assets/menu bars/homestate2over.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="assets/menu bars/homestate1up.jpg" alt="homebutton" name="home" width="128" height="30" border="0" id="home" onload="" /></a><a href="aboutus.htm" target="_top" onmouseout="MM_nbGroup('out');" onmouseover="MM_nbGroup('over','aboutus','assets/menu bars/aboutusstate2over.jpg','assets/menu bars/aboutusstate2over.jpg',1);" onclick="MM_nbGroup('down','navbar1','aboutus','assets/menu bars/aboutusstate3used.jpg',1);"><img name="aboutus" src="assets/menu bars/aboutusstate1up.jpg" width="128" height="30" border="0" id="aboutusstate1up" alt="aboutusbutton" /></a><a href="theteam.htm" target="_top" onclick="MM_nbGroup('down','group1','theteam','assets/menu bars/Theteamstate3used.jpg',1)" onmouseover="MM_nbGroup('over','theteam','assets/menu bars/Theteamstate2over.jpg','assets/menu bars/Theteamstate2over.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="assets/menu bars/theteamstate1up.jpg" alt="theteambutton" name="theteam" width="128" height="30" border="0" id="theteam" onload="" /></a><a href="ourservices.htm" target="_top" onClick="MM_nbGroup('down','group1','ourservices','assets/menu bars/ourservicestate2over.png',1)" onMouseOver="MM_nbGroup('over','ourservices','assets/menu bars/ourservicestate2over.jpg','assets/menu bars/ourservicestate2over.jpg',1)" onMouseOut="MM_nbGroup('out')"><img src="assets/menu bars/ourservicesstate1up.jpg" alt="oursevices button" name="ourservices" width="128" height="30" border="0" onLoad="" /></a><a href="contactus.htm" target="_top" onClick="MM_nbGroup('down','group1','contactus3','assets/menu bars/Contactusstate3used.jpg',1)" onMouseOver="MM_nbGroup('over','contactus3','assets/menu bars/Contactusstate2over.jpg','assets/menu bars/Contactusstate2over.jpg',1)" onMouseOut="MM_nbGroup('out')"><img src="assets/menu bars/Contactusstate1up.jpg" alt="contact us button" name="contactus3" width="128" height="30" border="0" onLoad="" /></a><a href="links.htm" target="_top" onclick="MM_nbGroup('down','group1','links','assets/menu bars/linksstate3used.jpg',1)" onmouseover="MM_nbGroup('over','links','assets/menu bars/linksstate2over.jpg','assets/menu bars/linksstate2over.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="assets/menu bars/linksstate1up.jpg" alt="linksbutton" name="links" width="128" height="30" border="0" id="links" onload="" /></a><a href="Arabic.htm" target="_top" onClick="MM_nbGroup('down','group1','arabic','assets/menu bars/arabicstate2over.jpg',1)" onMouseOver="MM_nbGroup('over','arabic','assets/menu bars/arabicstate2over.jpg','assets/menu bars/arabicstate2over.jpg',1)" onMouseOut="MM_nbGroup('out')"><img src="assets/menu bars/arabicstate1up.jpg" alt="arabicbutton" name="arabic" width="128" height="30" border="0" onLoad="" /></a></span></span></td>

                          </tr>

                        </table></td>

                      </tr>

                      <tr>

                        <td width="894" height="562" class="backgroundimage"><p class="mainbodycopy"> </p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy"><span class="mainbodycopyheader">Welcome to the London Gynae Consultancy</span></p>

                    <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy">We are a medical service dedicated to all your gynaecological needs. We offer an excellent </p>

                          <p class="mainbodycopy">range of services with both English and Arabic doctors and a female gynaecologist.</p>

                    <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy">Our range of servcies include the management of:</p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy">Heavy periods, fibroids, entometriosis and pelvic pain, colposcopy and smear abnormalities,</p>

                    <p class="mainbodycopy">infertility and polycystic ovarian syndrome, urinary incontinence, prolapse and problems</p>

                          <p class="mainbodycopy">of the menopause.</p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy">Womens health problems are often troublesome and embarressing, interfering</p>

                          <p class="mainbodycopy">with your way of life. We understand the sensitive issues surrounding</p>

                          <p class="mainbodycopy">the gynaecological problems you may be experiencing and offer</p>

                          <p class="mainbodycopy">fully comprehensive assessments, investigations and treatments</p>

                          <p class="mainbodycopy">in a comfortable and confidential environment.</p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy"> </p>

                          <p class="mainbodycopy"> </p>

                    <p class="mainbodycopy"><span class="mainbodycopyendline">Visit us </span><span class="mainbodycopyendline">to experience </span></p>

                        <p class="mainbodycopy"><span class="mainbodycopyendline">medical excellence</span> <span class="mainbodycopyendline">at its best</span></p>

                        <p class="mainbodycopy"> </p>

                        <p class="mainbodycopy"> </p>

                        <p class="mainbodycopy"> </p></td>

                      </tr>

                      <tr>

                        <td height="50" class="tcsfont"><p><a href="index.htm" title="Home">Home</a><a href="index3.htm"></a> | <a href="aboutus.htm">About Us</a> | <a href="theteam.htm">The Team</a> | <a href="ourservices.htm">Our Services</a> | <a href="contactus.htm">Contact Us</a> | <a href="links.htm" title="links">Links</a> | <a href="Arabic.htm">Arabic</a></p>

                    <p>All Rights Reserved 2011 - www.londongynaeconsultancy.com - website by moonmouse creative ltd</p></td>

                      </tr>

                    </table>

                    <p><br />

                    </p>

                    <p> </p>

                    </body>

                    </html>

                    • 7. Re: How do I ensure page background stays within table for different browser settings?
                      Ken Binney CommunityMVP

                      I was just asking for this, and I found it in your online CSS

                      .backgroundimage {

                          background-image: url(assets/backgroundunderconstr894x570.jpg);

                          background-repeat: no-repeat;

                          background-position: center bottom;

                      }

                       

                      I think your problem is that you also have that BF image in your body CSS try removing it from the body CSS

                       

                      body {

                          background-repeat: no-repeat;

                          font-family: Verdana, Geneva, sans-serif;

                          vertical-align: middle;

                          outline-style: none;

                          height: 700px;

                          width: auto;

                          padding-top: 0px;

                          margin-top: 20px;

                          margin-left: 0px;

                          padding-bottom: 0px;

                          background-image: url(assets/backgroundunderconstr894x570.jpg);

                          text-align: left;

                          float: none;

                          border-right-color: #CB1269;

                          border-left-color: #CB1269;

                          border-right-style: none;

                          border-left-style: none;

                          border-right-width: medium;

                          border-left-width: medium;

                          margin-right: 0px;

                          background-color: #F9E2E9;

                          background-attachment: inherit;

                          background-position: center 160px;

                      }

                      • 8. Re: How do I ensure page background stays within table for different browser settings?
                        bex43 Community Member

                        You are very generous with your time - thank you. 

                        I have deleted the background image from the body CSS but although the image appears within dreamweaver under td.backgroundimage it does not appear when I uploaded the page.

                         

                        Sorry again if I am a bit dim about this ... learning slowly!

                        • 9. Re: How do I ensure page background stays within table for different browser settings?
                          Ken Binney CommunityMVP

                          No Bex, you are not dim... there is something we are both missing in the CSS.

                          Osgood is great at this stuff, let's chant for him to fly in here and rescue us.

                           

                          I'll keep digging

                          • 10. Re: How do I ensure page background stays within table for different browser settings?
                            osgood_ CommunityMVP

                            The background is NOT showing because you have failed to close the css seletor below with a } If you do not close it the css cascade stops. Add a } as shown below at the end of the selector.

                             

                            .titlebox {

                                border-top-width: medium;

                                border-right-width: medium;

                                border-bottom-width: medium;

                                border-left-width: medium;

                                border-top-style: solid;

                                border-right-style: solid;

                                border-bottom-style: none;

                                border-left-style: solid;

                                border-top-color: #CC136B;

                                border-right-color: #CC136B;

                                border-bottom-color: #CC136B;

                                border-left-color: #CC136B;

                                border-color: #CB1269;

                                padding-top: 0px;

                                padding-left: 0px;

                                top: 10px;

                                bottom: 10px;

                                padding-bottom: 0px;

                                padding-right: 0px;

                            }

                             

                             

                            You sholud also have a . or # infront of the two selectors below. If they are classes add an . if they are ids add #

                             

                             

                            femalegynaecolourfont {

                                color: #CC1366;

                            }

                             

                             

                            horizontalbar {

                                color: #CC1366;

                            }

                            • 11. Re: How do I ensure page background stays within table for different browser settings?
                              bex43 Community Member

                              Yahooey!!!!!!  You guys are both geniuses and Im VERY grateful for your time!  Have a lovely day!

                               

                              Just one question, The image now holds within the table on my laptop but still not on an ipad - is there a reason for this?

                              • 12. Re: How do I ensure page background stays within table for different browser settings?
                                Ken Binney CommunityMVP

                                Sorry, no IPad to view it

                                Is the image too small for the IPAD table td display... or too large?

                                 

                                You might need to use a BG image stretching technique like this on at Nancy's site

                                http://alt-web.com/TEST/Resizable-BG.shtml

                                • 13. Re: How do I ensure page background stays within table for different browser settings?
                                  bex43 Community Member

                                  The images are now all ok for laptop and desktop but the only page that appears correctly on the ipad is THE TEAM page,- problem only on ipad - fine in other browsers. Frustrating that it is correct on this page but not the others.