Solved

CSS div problem

Posted on 2009-05-20
16
291 Views
Last Modified: 2012-05-07
Hey,

i have a page made of tables, however I need to place a circle over the top of the corner of a table, I have my CSS in place, and its kinda working...

Basically my table is set to align=center however the image moves dependng on the screen res of the person viewing it...

my code is below, but I dont know how to make it always in the corner of the page centred via the table, rather than always at the same location....
#introduce {

	position: absolute;

	top: 586px;

	left: 1159px;

	height: 165px;

	width:166px;

	z-index:2;

	color: #FFFFFF;

}

Open in new window

0
Comment
Question by:Wicked-Websites
  • 5
  • 4
  • 3
  • +2
16 Comments
 
LVL 16

Expert Comment

by:s8web
Comment Utility
Would it be possible for you to post a link to the page so we can take a look at what else is going on?
0
 

Author Comment

by:Wicked-Websites
Comment Utility
0
 
LVL 6

Expert Comment

by:mudbuggle
Comment Utility
We can come up with a solution but I will the css for the table as well.
0
 
LVL 6

Expert Comment

by:mudbuggle
Comment Utility
Set your position for left: 1159px to something like right: 18%. You'll have to adjust it for the appropriate positioning
0
 

Author Comment

by:Wicked-Websites
Comment Utility
problem is when it is viewed on different sized screens,

I've done the change, however it moves depending on the screen size, i need it to be exactly the same on each resolution
0
 
LVL 6

Expert Comment

by:mudbuggle
Comment Utility
try position: relative and play around with % and px... to see if that gets it to stay the same. Also post css if that doesn't work.
0
 
LVL 30

Accepted Solution

by:
LZ1 earned 250 total points
Comment Utility
See if this may help:
I did wrap everything in a #wrapper, however the main problem that is coming into play is that you are wanting to place an absolutely positioned DIV over a piece of the table.  I did wrap everything so that the #introduce element would have something to base itself off of other than the pure screen resolution.  You will still be affected by different resolutions regardless of where you place it.   But this may get you pointed in the right direction for now.  You may wish to convert your tables into DIVs later on for better placement and layout functionality.

<!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>Anglia Skips, Skip hire</title>

<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

<style> 

#introduce {

	height: 165px;

	width:166px;

	z-index:2;

	color: #FFFFFF;

	position: absolute;

	left: 75%;

	top: 56%;

}

#wrapper {

	width: 100%;

	margin-top: auto;

	margin-right: 0px;

	margin-bottom: auto;

	margin-left: 0px;

	position: relative;

	clear: both;

	height: 932px;

}

#flash {

	position:absolute;

	top: 16px;

	left: 779px;

	height: 158px;

	width: 231px;

	z-index:3;

	color: #FFFFFF;

	background-color: #FFE880;

}

.header, .header a {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 17px;

	font-style: normal;

	line-height: normal;

	font-weight: bold;

	font-variant: normal;

	text-transform: none;

	color: #8DB873;

	text-decoration: none;

}

.main {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	color: #000000;

	text-decoration: none;

}

.main a {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	color: #000000;

	text-decoration: underline;

}

.sadmain {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: bold;

	font-variant: normal;

	text-transform: none;

	color: #8DB873;

	text-decoration: none;

}

</style>

</head>

 

<body>

<div id="wrapper">

<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">

  <tr>

    <td height="156" align="center" bgcolor="#8DB873"><script type="text/javascript"> 

AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','215','height','156','src','flv/skippy','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flv/skippy' ); //end AC code

</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="215" height="156">

<param name="movie" value="http://skips.wicked-websites.co.uk/flv/skippy.swf" />

      <param name="quality" value="high" />

      <embed src="http://skips.wicked-websites.co.uk/flv/skippy.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="215" height="156"></embed>

    </object></noscript><img src="http://skips.wicked-websites.co.uk/images/header.jpg" width="544" height="156" />

      <script type="text/javascript"> 

AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','215','height','156','src','flv/skippy','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flv/skippy' ); //end AC code

</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="215" height="156">

<param name="movie" value="http://skips.wicked-websites.co.uk/flv/skippy.swf" />

      <param name="quality" value="high" />

      <embed src="http://skips.wicked-websites.co.uk/flv/skippy.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="215" height="156"></embed>

    </object></noscript></td>

  </tr>

  <tr>

    <td><table width="1000" border="0" align="center" cellpadding="0" cellspacing="10">

      <tr>

        <td width="142"><a href="index.php"><img src="http://skips.wicked-websites.co.uk/images/buttons/home.gif" title="Anglia Skips - Home Page" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="contact.php"><img src="http://skips.wicked-websites.co.uk/images/buttons/contact_us.gif" title="Anglia Skips - Contact Us" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="our_skips.php"><img src="http://skips.wicked-websites.co.uk/images/buttons/our_skips.gif" title="Anglia Skips - About Our Skips" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="use_skips.php"><img src="http://skips.wicked-websites.co.uk/images/buttons/using_skips.gif" title="Anglia Skips - How to use our skips" width="142" height="33" border="0" /></a></td>

        <td width="372"><a href="contact.php"><img src="http://skips.wicked-websites.co.uk/images/buttons/tel.gif" title="Anglia Skips - Contact Us" width="372" height="33" border="0" /></a></td>

      </tr>

    </table></td>

  </tr>

  <tr>

    <td><table width="1000" border="0" cellspacing="0" cellpadding="10">

      <tr>

        <td background="http://skips.wicked-websites.co.uk/images/green_back.jpg"><table width="980" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">

          <tr>

            <td height="304" colspan="3" valign="bottom"><img src="http://skips.wicked-websites.co.uk/images/skip_pic.jpg" width="576" height="289" hspace="15" /></td>

            <td align="center" valign="bottom"><table width="344" border="0" cellpadding="0" cellspacing="10" background="http://skips.wicked-websites.co.uk/images/yell_back.gif" height="289">

              <tr>

                <td><table width="324" border="0" cellpadding="5" cellspacing="0" bgcolor="#FFFFFF" height="269">

                    <tr>

                      <td align="left" valign="middle"><p class="header">Welcome to Anglia Skips Ltd</p>

                          <p class="main">Sizes of skips range from a small 2 yarder up to the

                            large 8 yarder and these are available for hire at very

                            competitive rates.</p>

                        <p class="main"> Make Robbie smile by putting him on your driveway or

                          outside your house and fill him up to the top.</p>

                        <p class="sadmain">Dont make him sad by leaving him in our yard!</p>

                        <p class="header"><a href="terms.pdf" target="_blank" title="Anglia Skips - Terms and Conditions">SKIP HIRE IS SUBJECT TO OUR<br />

                          TERMS AND CONDITIONS<img src="http://skips.wicked-websites.co.uk/images/arrows.gif" title="Anglia Skips - Skip Hire, Suffolk" width="25" height="15" border="0" /></a></p></td>

                    </tr>

                </table></td>

              </tr>

            </table></td>

          </tr>

          <tr>

      <td width="202" align="center"><a href="our_skips.php"><img src="http://skips.wicked-websites.co.uk/images/mini_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" hspace="15" vspace="15" border="0" /></a></td>

      <td width="202" align="center"><a href="our_skips.php"><img src="http://skips.wicked-websites.co.uk/images/midi_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" border="0" /></a></td>

      <td width="202" align="center"><a href="our_skips.php"><img src="http://skips.wicked-websites.co.uk/images/max_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" border="0" /></a></td>

      <td width="374" align="right"><a href="contact.php"><img src="http://skips.wicked-websites.co.uk/images/call_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="344" height="146" hspace="15" border="0" /></a></td>

          </tr>

        </table></td>

      </tr>

    </table></td>

  </tr>

</table>

<table width="1000" border="0" align="center" cellpadding="5" cellspacing="0" class="main">

  <tr>

    <td width="500">Anglia Skips Ltd, Building 4, 

      Airfield Industrial Estate, 

      Eye, Suffolk   IP23 7HN</td>

    <td align="right"><a href="http://www.wicked-websites.co.uk" target="_blank">Website designed and hosted by Wicked Websites</a></td>

    <td width="100">&nbsp;</td>

  </tr>

  <tr>

    <td colspan="2" align="center">

    <a href="index.php" title="Anglia Skips - Home Page" >Home</a> | 

    <a href="our_skips.php" title="Anglia Skips - About our skips" >Our Skips</a> | 

    <a href="use_skips.php" title="Anglia Skips - How to use our skips">How to use a skip</a> | 

    <a href="contact.php" title="Anglia Skips - Contact Us" >Contact Us</a> | 

  <a href="terms.pdf" target="_blank" title="Anglia Skips - Terms and Conditions" >Terms and Conditions</a></td></tr></table>

<div id="introduce">

<img src="http://skips.wicked-websites.co.uk/images/introducing.gif" width="165" height="166" alt="Anglia Skips" /></div>

</div>

</body>

</html>

Open in new window

0
How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

 
LVL 30

Expert Comment

by:IanTh
Comment Utility
the browser sets the position of images etc so all you can do is use a div as a wrapper and in css set the margins to auto for left , right, top and bottom so that your page will appear at the centre like this
http://www.up2youmobiles.co.uk/
it uses css for a overall background div with div's set for all the other images and page layout
I would say using div's is better than using tables these days
0
 

Author Comment

by:Wicked-Websites
Comment Utility
Hi,

My code is now attached, but it still moves about with the screen resolutions... its not right on a large screen, however on a smaller screen its ok?

Any other thoughts?

#introduce {

	height: 165px;

	width:166px;

	z-index:2;

	color: #FFFFFF;

	position: absolute;

	left: 75%;

	top: 56%;

}

#wrapper {

	width: 100%;

	margin-top: auto;

	margin-right: 0px;

	margin-bottom: auto;

	margin-left: 0px;

	position: relative;

	clear: both;

	height: 932px;

}

#flash {

	position:absolute;

	top: 16px;

	left: 779px;

	height: 158px;

	width: 231px;

	z-index:3;

	color: #FFFFFF;

	background-color: #FFE880;

}

.header, .header a {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 17px;

	font-style: normal;

	line-height: normal;

	font-weight: bold;

	font-variant: normal;

	text-transform: none;

	color: #8DB873;

	text-decoration: none;

}

.main {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	color: #000000;

	text-decoration: none;

}

.main a {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	color: #000000;

	text-decoration: underline;

}

.sadmain {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: bold;

	font-variant: normal;

	text-transform: none;

	color: #8DB873;

	text-decoration: none;

}
 
 
 

----
 
 
 

<body><div id="wrapper">

<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">

  <tr>

    <td height="156" align="center" bgcolor="#8DB873"><script type="text/javascript">

AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','215','height','156','src','flv/skippy','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flv/skippy' ); //end AC code

</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="215" height="156">

<param name="movie" value="flv/skippy.swf" />

      <param name="quality" value="high" />

      <embed src="flv/skippy.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="215" height="156"></embed>

    </object></noscript><img src="images/header.jpg" width="544" height="156" />

      <script type="text/javascript">

AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','215','height','156','src','flv/skippy','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flv/skippy' ); //end AC code

</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="215" height="156">

<param name="movie" value="flv/skippy.swf" />

      <param name="quality" value="high" />

      <embed src="flv/skippy.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="215" height="156"></embed>

    </object></noscript></td>

  </tr>

  <tr>

    <td><table width="1000" border="0" align="center" cellpadding="0" cellspacing="10">

      <tr>

        <td width="142"><a href="index.php"><img src="images/buttons/home.gif" title="Anglia Skips - Home Page" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="contact.php"><img src="images/buttons/contact_us.gif" title="Anglia Skips - Contact Us" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="our_skips.php"><img src="images/buttons/our_skips.gif" title="Anglia Skips - About Our Skips" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="use_skips.php"><img src="images/buttons/using_skips.gif" title="Anglia Skips - How to use our skips" width="142" height="33" border="0" /></a></td>

        <td width="372"><a href="contact.php"><img src="images/buttons/tel.gif" title="Anglia Skips - Contact Us" width="372" height="33" border="0" /></a></td>

      </tr>

    </table></td>

  </tr>

  <tr>

    <td><table width="1000" border="0" cellspacing="0" cellpadding="10">

      <tr>

        <td background="images/green_back.jpg"><table width="980" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">

          <tr>

            <td height="304" colspan="3" valign="bottom"><img src="images/skip_pic.jpg" width="576" height="289" hspace="15" /></td>

            <td align="center" valign="bottom"><table width="344" border="0" cellpadding="0" cellspacing="10" background="images/yell_back.gif" height="289">

              <tr>

                <td><table width="324" border="0" cellpadding="5" cellspacing="0" bgcolor="#FFFFFF" height="269">

                    <tr>

                      <td align="left" valign="middle"><p class="header">Welcome to Anglia Skips Ltd</p>

                          <p class="main">Sizes of skips range from a small 2 yarder up to the

                            large 8 yarder and these are available for hire at very

                            competitive rates.</p>

                        <p class="main"> Make Robbie smile by putting him on your driveway or

                          outside your house and fill him up to the top.</p>

                        <p class="sadmain">Dont make him sad by leaving him in our yard!</p>

                        <p class="header"><a href="terms.pdf" target="_blank" title="Anglia Skips - Terms and Conditions">SKIP HIRE IS SUBJECT TO OUR<br />

                          TERMS AND CONDITIONS<img src="images/arrows.gif" title="Anglia Skips - Skip Hire, Suffolk" width="25" height="15" border="0" /></a></p></td>

                    </tr>

                </table></td>

              </tr>

            </table></td>

          </tr>

          <tr>

      <td width="202" align="center"><a href="our_skips.php"><img src="images/mini_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" hspace="15" vspace="15" border="0" /></a></td>

      <td width="202" align="center"><a href="our_skips.php"><img src="images/midi_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" border="0" /></a></td>

      <td width="202" align="center"><a href="our_skips.php"><img src="images/max_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" border="0" /></a></td>

      <td width="374" align="right"><a href="contact.php"><img src="images/call_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="344" height="146" hspace="15" border="0" /></a></td>

          </tr>

        </table></td>

      </tr>

    </table></td>

  </tr>

</table>

<table width="1000" border="0" align="center" cellpadding="5" cellspacing="0" class="main">

  <tr>

    <td width="500">Anglia Skips Ltd, Building 4, 

      Airfield Industrial Estate, 

      Eye, Suffolk   IP23 7HN</td>

    <td align="right"><a href="http://www.wicked-websites.co.uk" target="_blank">Website designed and hosted by Wicked Websites</a></td>

    <td width="100">&nbsp;</td>

  </tr>

  <tr>

    <td colspan="2" align="center">

    <a href="index.php" title="Anglia Skips - Home Page" >Home</a> | 

    <a href="our_skips.php" title="Anglia Skips - About our skips" >Our Skips</a> | 

    <a href="use_skips.php" title="Anglia Skips - How to use our skips">How to use a skip</a> | 

    <a href="contact.php" title="Anglia Skips - Contact Us" >Contact Us</a> | 

    <a href="terms.pdf" target="_blank" title="Anglia Skips - Terms and Conditions" >Terms and Conditions</a>

    </td>

    <td>&nbsp;</td>

  </tr>

</table>

<p>&nbsp;</p>

<div id="introduce"><img src="images/introducing.gif" width="165" height="166" alt="Anglia Skips" /></div>

</div>

</body>

</html>

Open in new window

0
 
LVL 30

Expert Comment

by:IanTh
Comment Utility
it will in my opinion as browsers set the screen positions so the only real absolutes are left side , right side, bottom and top.
0
 
LVL 30

Expert Comment

by:IanTh
Comment Utility
like I said don't use tables use div's instead but it still will not get your desired effect nothing will
0
 
LVL 6

Expert Comment

by:mudbuggle
Comment Utility
I disagree. Worst case scenario we have to use javascript and some sort of mathematics to achieve the desired result. Unfortunately, I won't be able to play around with the code until this weekend.
0
 
LVL 30

Expert Comment

by:IanTh
Comment Utility
i am wondering how this would work I am looking forward to your post
0
 
LVL 30

Expert Comment

by:LZ1
Comment Utility
Or as a last resort you could always make an image of what you want.  
The image you have in there now, you could set it as a background image for that cell.  Then you could place the other image inside of it and either left, center or right align it.  
If that still doesn't work, you may want to make an entire image the exact way you want it to look and then simply place the image in the cell much like you have right now.
0
 
LVL 6

Assisted Solution

by:mudbuggle
mudbuggle earned 250 total points
Comment Utility
The following javascript works perfectly in ie6. I also added float : right; to the #introduce css. Unfortunately I don't have the capability of testing the javascript in other browsers at the current time. Gotta love IT red tape... However, I will test later and repost the corrections if need be. Test this out to see if it works for you.
If you need to adjust the positioning horizontally alter the following:
var rmw = screenw-1000; // increase the value of 1000 to move the element right and decrease the value to move it left.
<!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>Anglia Skips, Skip hire</title>

<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

<style> 

#introduce {

	height: 165px;

	width:166px;

	z-index:2;

	color: #FFFFFF;

	position: absolute;

	top: 586px;

	float: right;
 

}

#wrapper {

	width: 100%;

	margin-top: auto;

	margin-right: 0px;

	margin-bottom: auto;

	margin-left: 0px;

	position: relative;

	clear: both;

	height: 932px;

}

#flash {

	position:absolute;

	top: 16px;

	left: 779px;

	height: 158px;

	width: 231px;

	z-index:3;

	color: #FFFFFF;

	background-color: #FFE880;

}

.header, .header a {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 17px;

	font-style: normal;

	line-height: normal;

	font-weight: bold;

	font-variant: normal;

	text-transform: none;

	color: #8DB873;

	text-decoration: none;

}

.main {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	color: #000000;

	text-decoration: none;

}

.main a {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	color: #000000;

	text-decoration: underline;

}

.sadmain {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 13px;

	font-style: normal;

	line-height: normal;

	font-weight: bold;

	font-variant: normal;

	text-transform: none;

	color: #8DB873;

	text-decoration: none;

}

</style>
 

<script language="javascript">

function pos()

{

	var el = document.getElementById('introduce');

	var screenw = '';

	if(typeof(window.innerWidth)=='number') 

	{

		//Non-IE

		screenw = window.innerWidth;

	} 

	else if(document.body&&(document.body.clientWidth)) 

	{

		//IE	

		screenw = document.body.clientWidth;

	}

	var rmw = screenw-1000; // increase the value of 1000 to move the element right and decrease the value to move it left.

	var rpos = rmw/2;

	el.style.pixelRight = rpos;

	return;

}

</script>
 

</head>
 

<body onload="pos()" onresize="pos()"><div id="wrapper">

<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">

  <tr>

    <td height="156" align="center" bgcolor="#8DB873"><script type="text/javascript">

AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','215','height','156','src','flv/skippy','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flv/skippy' ); //end AC code

</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="215" height="156">

<param name="movie" value="flv/skippy.swf" />

      <param name="quality" value="high" />

      <embed src="flv/skippy.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="215" height="156"></embed>

    </object></noscript><img src="images/header.jpg" width="544" height="156" />

      <script type="text/javascript">

AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','215','height','156','src','flv/skippy','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flv/skippy' ); //end AC code

</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="215" height="156">

<param name="movie" value="flv/skippy.swf" />

      <param name="quality" value="high" />

      <embed src="flv/skippy.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="215" height="156"></embed>

    </object></noscript></td>

  </tr>

  <tr>

    <td><table width="1000" border="0" align="center" cellpadding="0" cellspacing="10">

      <tr>

        <td width="142"><a href="index.php"><img src="images/buttons/home.gif" title="Anglia Skips - Home Page" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="contact.php"><img src="images/buttons/contact_us.gif" title="Anglia Skips - Contact Us" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="our_skips.php"><img src="images/buttons/our_skips.gif" title="Anglia Skips - About Our Skips" width="142" height="33" border="0" /></a></td>

        <td width="142"><a href="use_skips.php"><img src="images/buttons/using_skips.gif" title="Anglia Skips - How to use our skips" width="142" height="33" border="0" /></a></td>

        <td width="372"><a href="contact.php"><img src="images/buttons/tel.gif" title="Anglia Skips - Contact Us" width="372" height="33" border="0" /></a></td>

      </tr>

    </table></td>

  </tr>

  <tr>

    <td><table width="1000" border="0" cellspacing="0" cellpadding="10">

      <tr>

        <td background="images/green_back.jpg"><table width="980" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">

          <tr>

            <td height="304" colspan="3" valign="bottom"><img src="images/skip_pic.jpg" width="576" height="289" hspace="15" /></td>

            <td align="center" valign="bottom"><table width="344" border="0" cellpadding="0" cellspacing="10" background="images/yell_back.gif" height="289">

              <tr>

                <td><table width="324" border="0" cellpadding="5" cellspacing="0" bgcolor="#FFFFFF" height="269">

                    <tr>

                      <td align="left" valign="middle"><p class="header">Welcome to Anglia Skips Ltd</p>

                          <p class="main">Sizes of skips range from a small 2 yarder up to the

                            large 8 yarder and these are available for hire at very

                            competitive rates.</p>

                        <p class="main"> Make Robbie smile by putting him on your driveway or

                          outside your house and fill him up to the top.</p>

                        <p class="sadmain">Dont make him sad by leaving him in our yard!</p>

                        <p class="header"><a href="terms.pdf" target="_blank" title="Anglia Skips - Terms and Conditions">SKIP HIRE IS SUBJECT TO OUR<br />

                          TERMS AND CONDITIONS<img src="images/arrows.gif" title="Anglia Skips - Skip Hire, Suffolk" width="25" height="15" border="0" /></a></p></td>

                    </tr>

                </table></td>

              </tr>

            </table></td>

          </tr>

          <tr>

      <td width="202" align="center"><a href="our_skips.php"><img src="images/mini_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" hspace="15" vspace="15" border="0" /></a></td>

      <td width="202" align="center"><a href="our_skips.php"><img src="images/midi_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" border="0" /></a></td>

      <td width="202" align="center"><a href="our_skips.php"><img src="images/max_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="172" height="146" border="0" /></a></td>

      <td width="374" align="right"><a href="contact.php"><img src="images/call_ad.jpg" title="Mini Skip Hire from Anglia Skips, Eye" width="344" height="146" hspace="15" border="0" /></a></td>

          </tr>

        </table></td>

      </tr>

    </table></td>

  </tr>

</table>

<table width="1000" border="0" align="center" cellpadding="5" cellspacing="0" class="main">

  <tr>

    <td width="500">Anglia Skips Ltd, Building 4, 

      Airfield Industrial Estate, 

      Eye, Suffolk   IP23 7HN</td>

    <td align="right"><a href="http://www.wicked-websites.co.uk" target="_blank">Website designed and hosted by Wicked Websites</a></td>

    <td width="100">&nbsp;</td>

  </tr>

  <tr>

    <td colspan="2" align="center">

    <a href="index.php" title="Anglia Skips - Home Page" >Home</a> | 

    <a href="our_skips.php" title="Anglia Skips - About our skips" >Our Skips</a> | 

    <a href="use_skips.php" title="Anglia Skips - How to use our skips">How to use a skip</a> | 

    <a href="contact.php" title="Anglia Skips - Contact Us" >Contact Us</a> | 

    <a href="terms.pdf" target="_blank" title="Anglia Skips - Terms and Conditions" >Terms and Conditions</a>

    </td>

    <td>&nbsp;</td>

  </tr>

</table>

<p>&nbsp;</p>

<div id="introduce"><img src="images/introducing.gif" width="165" height="166" alt="Anglia Skips" /></div></div>

</body>

</html>

Open in new window

0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now