CSS - Ie7 Page Too Wide

Hello, I'm afraid I'm back with more problems

I have a 3 column layout. the Left column is floated left, right floated left and the middle column uses left and right margins. I then had cause to set a width on the middle column to give something with Layout for IE.

When I add the width to the middle column, it looks fine in firefox but for some reason in IE, my middle div drops underneath the two floated divs, as if it is too wide.

I have tried debuging by using background colours on the Divs and the width of the coloured area is the same in both browsers. It is as if there is something leaking out the sides. Even on this most basic example. Am I missing something basic?

Code:

<div id="wrapper" style="width:996px; background-color:#666666; margin-left:auto; margin-right:auto;">
	<div id="lbar" style="float:left; width:170px; padding-left:10px; background-color:#FF0000; ">
	  <p>left</p>
	</div>
	<div id="rbar" style="float:right; width:305px; background-color:#0033FF;">
	  <p>right</p>
	</div>
	<div id="middle" style="margin-left:190px; width:491px; margin-right:315px; background-color:#99CCCC;">
	  <p>middle</p>
	</div>
</div>

Thank you for any time taken in reading this

JJ

This is the line in my index.html:
PHP Code:
<PRE class=yup>blah blah blah and more blah blah blahblah more blah blah blah yes yes blah blah</PRE> 





This is my PRE code in style.css:
PHP Code:
 PRE {
    BORDER-RIGHT: #2f6fab 1px dashed; 
    PADDING-RIGHT: 1em; BORDER-TOP: #2f6fab 1px dashed; 
    PADDING-LEFT: 1em; PADDING-BOTTOM: 1em; BORDER-LEFT: #2f6fab 1px dashed; 
    COLOR: #000000; LINE-HEIGHT: 1.1em; PADDING-TOP: 1em; 
    BORDER-BOTTOM: #2f6fab 1px dashed; BACKGROUND-COLOR: #f9f9f9;
    width: 90%;
}
PRE.yup {
    COLOR: #000000;
    FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
    FONT-SIZE: 12px;
    text-align: left;
    width: 80%;
    margin: 12px auto;
} 





The PRE tag is in a table and i want the long text the same lenght as the short text, but i have no clue how to do it. Any ideas?

Probably there already was such question, but my Internet connection is very slow and I don't have time to search thru topics.

So, when I put an image into centercolumn that has big width my right column stays where it was, but center column with the picture goes to the right widely, and right column stays over the picture.
But I want right column always follow center column (stays on the right of centercolumn whatever size it is).

How to fix it in css?

here is my code:

BODY {
PADDING-RIGHT:0;
PADDING-LEFT:0;
BACKGROUND:url(img_86.gif) #ddd;
PADDING-BOTTOM:0;
MARGIN:0;
PADDING-TOP:0;
FONT-SIZE:12px;
LINE-HEIGHT:18px;
FONT-FAMILY:tahoma,verdana,geneva,arial,helvetica,sans-serif;
}

.registered {
BACKGROUND-COLOR:#ff9;
}

#centercolumn {
BORDER-RIGHT:#666 0 solid;
PADDING-RIGHT:4px;
BORDER-TOP:#666 0 solid;
PADDING-LEFT:4px;
PADDING-BOTTOM:10px;
MARGIN-LEFT:179px;
BORDER-LEFT:#666 0 solid;
MARGIN-RIGHT:179px;
PADDING-TOP:10px;
BORDER-BOTTOM:#666 0 solid;
}

#header {
PADDING-RIGHT:8px;
BORDER-TOP:#182746 2px solid;
PADDING-LEFT:8px;
BACKGROUND:url(img_87.gif) #314e8c;
PADDING-BOTTOM:8px;
PADDING-TOP:8px;
BORDER-BOTTOM:#182746 2px solid;
}

#leftcolumn {
MARGIN-TOP:4px;
LEFT:0;
WIDTH:180px;
POSITION:absolute;
FONT-SIZE:11px;
LINE-HEIGHT:16px;
}

#rightcolumn {
MARGIN-TOP:4px;
RIGHT:0;
WIDTH:180px;
POSITION:absolute;
FONT-SIZE:11px;
LINE-HEIGHT:16px;
}

#footer {
CLEAR:both;
MARGIN-BOTTOM:12px;
}

.block {
BORDER-RIGHT:#999 1px solid;
PADDING-RIGHT:4px;
BORDER-TOP:#999 1px solid;
PADDING-LEFT:4px;
BACKGROUND:#fff;
PADDING-BOTTOM:4px;
MARGIN:6px 6px 12px;
BORDER-LEFT:#999 1px solid;
PADDING-TOP:4px;
BORDER-BOTTOM:#999 1px solid;
}

.block H3 {
PADDING-RIGHT:4px;
PADDING-LEFT:4px;
FONT-SIZE:11px;
BACKGROUND:#a7b6c9;
PADDING-BOTTOM:4px;
MARGIN:-4px -4px 4px;
COLOR:#26344c;
PADDING-TOP:4px;
BORDER-BOTTOM:#999 1px solid;
}

.block P {
MARGIN:0;
}

.content {
BORDER-RIGHT:#999 1px solid;
PADDING-RIGHT:4px;
BORDER-TOP:#999 1px solid;
PADDING-LEFT:4px;
BACKGROUND:#fff;
PADDING-BOTTOM:4px;
BORDER-LEFT:#999 1px solid;
PADDING-TOP:4px;
BORDER-BOTTOM:#999 1px solid;
}

.entrycontent {
BORDER-RIGHT:#999 1px solid;
PADDING-RIGHT:12px;
BORDER-TOP:#999 1px solid;
PADDING-LEFT:12px;
BACKGROUND:#fff;
PADDING-BOTTOM:12px;
BORDER-LEFT:#999 1px solid;
PADDING-TOP:12px;
BORDER-BOTTOM:#999 1px solid;
}

.content P {
MARGIN:4px 2px;
}

H1 {
DISPLAY:inline;
FONT-SIZE:16px;
MARGIN:4px;
COLOR:#fff;
}

H2 {
PADDING-RIGHT:2px;
PADDING-LEFT:2px;
FONT-SIZE:13px;
PADDING-BOTTOM:2px;
MARGIN:0;
COLOR:#26344c;
PADDING-TOP:2px;
BORDER-BOTTOM:#999 1px dashed;
}

H3 {
FONT-SIZE:13px;
}

.entryfooter {
CLEAR:both;
PADDING-RIGHT:0;
PADDING-LEFT:0;
FONT-WEIGHT:normal;
FONT-SIZE:11px;
PADDING-BOTTOM:6px;
MARGIN:0;
COLOR:#666;
LINE-HEIGHT:16px;
PADDING-TOP:6px;
FONT-FAMILY:tahoma,verdana,geneva,arial,helvetica,sans-serif;
TEXT-ALIGN:right;
}

.entryfooter_linkdump {
PADDING-RIGHT:0;
PADDING-LEFT:0;
FONT-WEIGHT:normal;
FONT-SIZE:10px;
PADDING-BOTTOM:6px;
MARGIN:0;
COLOR:#666;
LINE-HEIGHT:16px;
PADDING-TOP:6px;
BORDER-BOTTOM:#666 1px dashed;
FONT-FAMILY:tahoma,verdana,geneva,arial,helvetica,sans-serif;
TEXT-ALIGN:right;
}

A {
COLOR:#253a69;
}

.prevnext_links {
FLOAT:right;
COLOR:#fff;
}

.searchbox {
FONT-SIZE:10px;
WIDTH:10em;
}

.searchbutton {
BORDER-RIGHT:#000 1px solid;
BORDER-TOP:#000 1px solid;
FONT-SIZE:10px;
BORDER-LEFT:#000 1px solid;
BORDER-BOTTOM:#000 1px solid;
}

IMG.badge {
BORDER-TOP-WIDTH:0;
BORDER-LEFT-WIDTH:0;
BORDER-BOTTOM-WIDTH:0;
MARGIN-BOTTOM:2px;
BORDER-RIGHT-WIDTH:0;
}

A IMG.badge:hover {
MARGIN-BOTTOM:1px;
BORDER-BOTTOM:#314e8c 1px solid;
}

P,HTML,TABLE,TD {
FONT-SIZE:12px;
LINE-HEIGHT:18px;
FONT-FAMILY:tahoma,verdana,geneva,arial,helvetica,sans-serif;
}

#leftcolumn P,#rightcolumn P {
FONT-SIZE:11px;
LINE-HEIGHT:16px;
}

H4,.subtitle {
DISPLAY:inline;
FONT-SIZE:14px;
MARGIN:4px;
COLOR:#fff;
FONT-STYLE:italic;
}

.date_linkdump,.date {
FONT-WEIGHT:normal;
FONT-SIZE:10px;
FLOAT:right;
COLOR:#666;
LINE-HEIGHT:16px;
FONT-FAMILY:tahoma,verdana,geneva,arial,helvetica,sans-serif;
}

.entryfooter A,.date A,.entryfooter_linkdump A,.date_linkdump A {
FONT-WEIGHT:bold;
COLOR:#5c6b8e;
TEXT-DECORATION:none;
}

.date A:hover,.entryfooter A:hover {
FONT-WEIGHT:bold;
COLOR:#5c6b8e;
TEXT-DECORATION:underline;
}

H1 A,.prevnext_links A {
FONT-WEIGHT:bold;
COLOR:#fff;
TEXT-DECORATION:none;
}


and here's screenshot

Help! I am trying to build my site in CSS. Here is the CSS for my top layer, despite the size being specified to 130px and an image inside it being 130px high, it is still 5px too high... any ideas?

Code:

#page_top_sizing {
	background-color: red;
	width: 764px;
	height: 130px;
	position: absolute;
	top: 5px;
	left: 5px;
	z-index:1;
	padding:0;
}

Thanks.

Hi guys,
I've got both long and wide table to be showed and printed.
Customer would like that for scrolling, some left columns will freeze on the left (when printed, will be printed on every page), same for table header (fixed when scrolling, repeated on top of every page when printing).
For fixed table headers, there are lots of tutorials, like:
http://www.cssplay.co.uk/menu/tablescroll.html
And for printing, good browsers can repeat thead on every page (don't know how to achieve this for IE).
But for columns locking (repeating for print), I'm totally stuck. Yes, some stuff can be found for scrolling, like:
http://web.tampabay.rr.com/bmerkey/...column-csv.html
But these solutions usually use JavaScript or are not cross-browser.

Is there any way how to do this?
Primarily for IE 6.0/7.0

I can't connect to W3C CSS and HTML tutorials. Does anyone else have the same problem?
http://www.w3schools.com/css/default.asp

Whats wrong? Did the Iceland Volcano ash break down the site?

Does any one have another good resource that is as concise as WC3?

Hi,

I am a wannabe css compiler...

Have the following problem.

wrote css for a square screen monitor and placed css box in an area to the right of center, my partner called and told me it sat to the left over the side menu onher wide screen.

I cannot figure out how to compensate the (top/left) position to cover both type screens...

Anyone help me?

I am generating a list with PHP that is going to be printed out and hung up for display. I would prefer if the following weren't printed.

1) Top Left - Page Title (I know I can have this disappear by having a blank title, but I would prefer to have one)
2) Top Right - Page URL
3) Bottom Left - Page number (ex: 1 of 2)
4) Bottom Right - Date

Is there any way to print the list without these? I wasn't sure if there is some css I can use, or if this is something that the printer prints automatically.

Thanks

Hi All :

Currently i'm running in .NET platform together with VB.net and ASP.

I faced a problem regarding to the PAGE BREAK html tag. The problem is when i want to print out a report, it will show with scroll bar and the report is very long. So what i have to do is to apply Page-Break-After/Before into the HTML. how am i know if the report already apply the Page Break function or not? And the only style i can use is CSS. Anyone familiar with this? It's urgent !! Hope can get anyone help asap.


Regards,
JeFFery

Howcome:

html, body {
color: #06F;
background-color: #000;
font-size: 16px;
text-align: center;
width: 768px;
}

Doesn't center the page in the browser? How can I center it?

Output example on my website here.

I am trying to make a pattern tile the full height of the page and match up with an image at the top. It's a little bit hard to explain and a lot easier to show, so I've documented my first two attempts below.

Failed Solution 1 - Pattern as a part of a div set at height: 100%; with outer divs also set at height: 100%;

See attempt 1: Code:

http://www.hesterdesigns.com/Web2/yellow.html

Problem is that the divs aren't growing to the height of the page, and so the pattern isn't tiling the whole height of the page.

Failed Solution 2 - The Pattern is part of the body background which tiles on y.

See attempt 2: Code:

http://www.hesterdesigns.com/Web2/index.html

Any suggestions?

I'm hoping to find a way to do this using only CSS and without having to resort to Javascript solutions.

Hello everyone, I've been working on my school website for some time now - but I recently started over where the markup and style sheets are concerned. Both my html and css validate.

This is my html source:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Secondary School</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
<!--
function view_event(url)
{
	window.open(url, 'event', 'top=100, left=100, width=200, height=350');
	return false;
}
//-->
</script>
</head>
<body>
<div id="container">
  <h1>  Secondary.School. </h1>
  <div id="nav">

    <ul>
      <li> <a href="index.php"> Homepage </a> </li>
      <li> <a href="#"> School Information </a> </li>
      <li> <a href="departments.html"> Departments </a> </li>

      <li> <a href="#"> Clubs </a> </li>
      <li> <a href="#"> SCC </a> </li>
      <li> <a href="#"> Resources </a> </li>

    </ul>
  </div>
  <div id="primaryRail" class="rail">
    <h2> Contact information </h2>
    <p> <b> 127 Maple Street Testo, Orbuk, H58 435 </b> <br />
      <b> Telephone: </b> (456) 245-5677 <br />

      <b> Fax: </b> (456) 456-4567 </p>
  </div>
  <div id="secondaryRail" class="rail">
    <h2> Our administration </h2>
    <p> <b> Principal: </b> <i> Alan N </i> <br />

      <b> Vice-Principal: </b> <i> Lucy S </i> <br />
      <b> Vice-Principal: </b> <i> Candice H </i> </p>
  </div>

  <div id="primaryContent" class="content">
<h3> Welcome to the Secondary School website! </h3>
    <p><b>XHTML TESTING</b><br />

      April 11, 2007<br />

      Posted by : <b>admin</b><br />

      Pellentesque sit amet mauris. Nullam non lacus. Etiam auctor. In purus.
      Nulla dolor lectus, posuere et, cursus a, tincidunt non, mi. Vestibulum
      interdum turpis in erat vehicula consequat. Vivamus sit amet turpis vitae
      massa tristique auctor. Mauris quis turpis. Quisque at mi. Suspendisse
      consequat faucibus elit. Morbi scelerisque porttitor ligula. Vestibulum
      non purus. <a href="#"> link testing </a><br />

      <a href="#top">Top</a></p><p><b>admin</b><br />

      April 11, 2007<br />

      Posted by : <b>admin</b><br />

      Pellentesque sit amet mauris. Nullam non lacus. Etiam auctor. In purus.
      Nulla dolor lectus, posuere et, cursus a, tincidunt non, mi. Vestibulum
      interdum turpis in erat vehicula consequat. Vivamus sit amet turpis vitae
      massa tristique auctor. Mauris quis turpis. Quisque at mi. Suspendisse
      consequat faucibus elit. Morbi scelerisque porttitor ligula. Vestibulum
      non purus. <br />

      <a href="#top">Top</a></p><p><b>test</b><br />

      April 10, 2007<br />

      Posted by : <b>mr.southern</b><br />

      test<br />

      <a href="#top">Top</a></p><p><b>test</b><br />

      April 10, 2007<br />

      Posted by : <b>mr.s</b><br />

      test<br />

      <a href="#top">Top</a></p><p><b>Testing</b><br />

      April 09, 2007<br />

      Posted by : <b>Jonathan</b><br />

      This is just a test message.<br />

      <a href="#top">Top</a></p><p><b>test</b><br />

      April 05, 2007<br />

      Posted by : <b>test</b><br />

      test<br />

      <a href="#top">Top</a></p><p><b>Test</b><br />

      April 05, 2007<br />

      Posted by : <b>Jonathan</b><br />

      Test.<br />

      <a href="#top">Top</a></p><p><b>Another test post.</b><br />

      April 05, 2007<br />

      Posted by : <b>Jonathan</b><br />

      Just another test.<br />

      <a href="#top">Top</a></p><p><b>Lorem ipsum dolar et sit</b><br />

      April 05, 2007<br />

      Posted by : <b>Jonathan</b><br />

      This is just a test post.<br />

      <a href="#top">Top</a></p><p><b>Lorem ipsum dolar et sit</b><br />

      April 05, 2007<br />

      Posted by : <b>Jonathan</b><br />

      This is just a test post.<br />

      <a href="#top">Top</a></p>  </div>
  <div id="secondaryContent" class="content">
  
<h2>Calendar for April 2007</h2>
	<table>
		<tr class="days"><td>Su</td>

<td>Mo</td>
<td>Tu</td>
<td>We</td>
<td>Th</td>
<td>Fr</td>
<td>Sa</td>
</tr>
		<tr><td class="week" title="Sun, 01st April 2007">1</td>
<td class="week" title="Mon, 02nd April 2007">2</td>

<td class="week" title="Tue, 03rd April 2007">3</td>
<td class="week" title="Wed, 04th April 2007">4</td>
<td class="week" title="Thu, 05th April 2007">5</td>
<td class="week" title="Fri, 06th April 2007">6</td>
<td class="week" title="Sat, 07th April 2007">7</td>

</tr><tr>
<td class="week" title="Sun, 08th April 2007">8</td>
<td class="week" title="Mon, 09th April 2007">9</td>
<td class="week" title="Tue, 10th April 2007">10</td>

<td class="week" title="Wed, 11th April 2007">11</td>
<td class="week" title="Thu, 12th April 2007">12</td>
<td class="week" title="Fri, 13th April 2007">13</td>
<td class="week" title="Sat, 14th April 2007">14</td>

</tr><tr>
<td class="week" title="Sun, 15th April 2007">15</td>
<td class="week" title="Mon, 16th April 2007"><a href="calendar.php?dateline=1176699600" style="padding: 0px;" onclick="return view_event(this.href);"><span style="color: red; font-weight: bold;">16</span></a></td>
<td class="week" title="Tue, 17th April 2007">17</td>
<td class="week" title="Wed, 18th April 2007">18</td>

<td class="week" title="Thu, 19th April 2007">19</td>
<td class="week" title="Fri, 20th April 2007">20</td>
<td class="week" title="Sat, 21st April 2007">21</td>

</tr><tr>
<td class="week" title="Sun, 22nd April 2007">22</td>
<td class="week" title="Mon, 23rd April 2007">23</td>
<td class="week" title="Tue, 24th April 2007">24</td>
<td class="week" title="Wed, 25th April 2007">25</td>
<td class="week" title="Thu, 26th April 2007">26</td>

<td class="week" title="Fri, 27th April 2007">27</td>
<td class="week" title="Sat, 28th April 2007">28</td>

</tr><tr>
<td class="week" title="Sun, 29th April 2007">29</td>
<td class="week" title="Mon, 30th April 2007">30</td>
<td class="week">&nbsp;</td>
<td class="week">&nbsp;</td>
<td class="week">&nbsp;</td>
<td class="week">&nbsp;</td>
<td class="week">&nbsp;</td>
</tr>
	</table>

	



<a href="index.php?m=3">Previous month</a>
<a href="index.php?m=5">Next month</a> 	
	<p style="font-weight: bold;">XHTML TESTING</p>
	
		
	<p style="font-weight: bold;">admin</p>
	
		
	<p style="font-weight: bold;">test</p>
	
		
	<p style="font-weight: bold;">test</p>
	
		
	<p style="font-weight: bold;">Testing</p>

	
		
	<p style="font-weight: bold;">test</p>
	
		
	<p style="font-weight: bold;">Test</p>
	
		
	<p style="font-weight: bold;">Another test post.</p>
	
		
	<p style="font-weight: bold;">Lorem ipsum dolar et sit</p>
	
		
	<p style="font-weight: bold;">Lorem ipsum dolar et sit</p>
	
	    <p>Pellentesque sit amet mauris. Nullam non lacus. Etiam auctor. In purus.
      Nulla dolor lectus, posuere et, cursus a, tincidunt non, mi. Vestibulum
      interdum turpis in erat vehicula consequat. Vivamus sit amet turpis vitae
      massa tristique auctor. Mauris quis turpis. Quisque at mi. Suspendisse
      consequat faucibus elit. Morbi scelerisque porttitor ligula. Vestibulum
      non purus. </p>

  </div>
</div>
<div id="footer">
  <p> <img src="images/tiger.jpg" alt="tiger logo" style="float: left;" /> | <a href="#"> homepage </a> | <a href="#"> school
      information </a> | <a href="#"> departments </a> | <a href="#"> clubs </a> | <a href="#"> scc </a> | <a href="#"> resources </a> | <br />

    Copyright <span style="font-size: x-small;"> 2007 </span>  Secondary
    School. </p>
</div>
</body>
</html>

And this is my style sheet:

Code:

 
/* Secondary School CSS Document 
/* Page and Link Formatting 
---------------------------- */
a
{
text-decoration: underline;
font-family: Georgia;
padding-bottom: 3px;
color: #FF42B1;
}
#nav a
{
text-decoration: none;
font-family: Georgia;
font-size: 12px;
padding: 12px 10px 8px 10px;
color: #F9F9F9;
}
#nav a:hover 
{
background: #454545;
}
#nav li
{
display: inline;
}
body 
{
background: url('images/header.png') repeat-x;
margin: 0px;
padding: 0px;
text-align:center;
}
/* Divs etc... 
---------------------------- */
#container
{
margin:0px auto;
width: 700px;
text-align: left;
}
#container h1
{
margin-top: 60px;
}
#primaryRail 
{
width: 350px;
float: left;
}
#secondaryRail
{
width: 350px;
float: left;
}
#primaryContent
{
margin: 55px 0px 0px 0px;
width: 500px;
float: left;
}
#secondaryContent
{
margin: 55px 0px 0px 25px;
width: 175px;
float: left;
}
#footer 
{
clear: both;
text-align: center;
background: #EDEDED;
border: #E2E2E2 2px solid;
}
/* Standard Elements 
---------------------------- */
h1
{
font-family: Georgia;
font-weight: normal;
font-size: 2em;
color: #F9F9F9;
}
h2
{
font-family: Georgia;
font-weight: normal;
font-size: 1.5em;
color: #454545;
}
h3
{
font-family: Georgia;
font-weight: normal;
font-size: 1.5em;
color: #812F2F;
}
.rail h2
{
color: #FFD11B;
}
p
{
font-family: Georgia;
font-size: .85em;
color: #454545;
}
.rail p
{
color: #F9F9F9;
}
.content p
{
line-height: 1.5em;
}
ul
{
padding: 0px;
}
li
{
list-style: none;
}
table 
{
color: #AFAFAF;
}
td 
{
padding: 5px;
padding-top: 2px;
padding-bottom: 2px;
}
.days 
{
background: #DCDCDC;
font-weight: bold;
font-size: .75em;
}
.week 
{
background: #FFFFFF;
font-size: .75em;
}
.nomonth 
{
background: #FAFAFA;
}
#swd_info
{
display: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
position: absolute;
width: 180px;
background-color: #FFFF99;
color: #000000;
border: 1px solid #000000;
padding: 3px;
font-size: 10px;
text-align: justify;
}

This is how it looks in FF, and that is how I would like to to be in FF, and any common browser that the user may be operating:

img133.imageshack.us/my.php?image=ffexampletx6.jpg

Thank you!

Alright... I give up on this one. The copyright moves up and down by a pixel or two between different pages. Go from the Home page to the Diabetes page and look at the footer and you will see. I have tried changing the margins, padding, and line-height on the text in the footer. I can get it to temporarily work but as soon as I change anything above the copyright (i.e. in the #content div) like line-height, add text, and etc it moves the copyright between pages again. Basically the content div is pushing down on the copyright differently depending on the amount of text that is in the article. Because other than the text all the articles pages code is exactly the same. All the footer text is a PHP include if that makes a difference. Thanks for looking at it because I have been working on this for quite a few days now and it is buggin the ba-jesus out of me?

I have a theory, the footer (thats where the copyright is) is absolute positioned. Therefore it is taken out of the flow of the document. Could this be the cause of my problem? So if I were to place all the copyright and footer links within another div within the footer div would that bring those back into flow? Like if I gave that new div a position of static or something? Or is it out of the flow regardless because it's sitting inside of an absolute positioned div? Thanks a lot - here is the site in question

Hi,

I have a front page which is one image only, no text. The image is centered horizontally (i.e. a simply text-align: center; ). My question is - how do I centre it vertically? (no matter what the resolution of the website visitor is).

i.e. Currently the image is at the top of my screen. I would like it to be in the centre, both horizontally and vertically.

Many thanks!