Forum Moderators: not2easy
The "banner" div should be aligned 2px right within the "outerpage" container div, but in the cache is aligned 2px from the edge of the body.
The "adslead" div should be centered within the "outerpage" container div, but is aligned to the left in the container.
Also if I resize the window when viewing the cache, I have to refresh the page to see it. Again only necessary in IE7.
Any suggestions about what Google markup is causing this will be welcomed, as then maybe I can do something about it!
XHTML (simplified)
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Language" content="en" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>#*$!</title>
<meta name="Description" content="yyy" />
<meta name="Keywords" content="zzz" />
<link href="../includes/css/styles.css" rel="stylesheet" type="text/css" />
</head>
<body class="standard">
<a name="a"></a>
<div class="outerpage"> <!-- container div -->
<div class="banner"> <!-- contains logo and text --> </div>
<div class="clearboth"> </div>
<div class="innerpage">
<div class="adslead"> <!-- contains leaderboard ads --> </div>
<div class="panewide">
<div class="panecenter-img"> <!-- contains content --> </div>
<div class="paneright-img"> <!-- contains thumbnails --> </div>
<div class="clearboth"> </div>
</div> <!-- end panewide -->
<div class="paneleft"> <!-- contains indexes --> </div>
<div class="clearboth"> </div>
</div> <!-- end innerpage -->
<div class="footer"> <!-- contains footer stuff --> </div>
<div class="footer2"> <!-- contains footer stuff --> </div>
</div> <!-- end outerpage -->
</body>
</html>
CSS
body.standard{
margin:0;
padding:0;
background-color:#123454;
text-align:center;
}
.outerpage{
width:780px;
margin-left:auto;
margin-right:auto;
padding:2px 0 0 0;
text-align:left;
background-color:#ffffff;
margin-top:4px;
}
.innerpage, .banner{
position:relative;
left:2px;
}
.banner{
width:774px;
min-height:44px;
padding:0;
text-align:left;
background-image:url(DIRECTORY/FILENAME.jpg);
background-position:top right;
background-repeat:no-repeat;
border:1px solid #000000;
}
.innerpage{
width:776px;
padding:4px 0 0 0;
text-align:left;
}
.clearboth{
height:0;
font-size:0;
line-height:0;
margin:0;
padding:0;
clear:both;
}
.adslead {
margin-left:auto;
margin-right:auto;
margin-top:6px;
margin-bottom:6px;
width:728px;
height:90px;
}
.panewide{
width:651px;
float:right;
padding:0;
border:0;
}
.panecenter-img{
width:558px;
float:left;
padding:0;
text-align:center;
}
.paneright-img{
width:90px;
float:right;
padding:0;
border:0;
font:8pt "Arial",sans-serif;
color:#000000;
text-align:center;
}
.paneleft{
width:122px;
float:left;
padding:0;
font:8pt "Arial",sans-serif;
color:#000000;
text-align:left;
}
.footer, .footer2 {
width:772px;
padding:0;
font:8pt "Arial",sans-serif;
color:#666666;
margin:0 0 2px 4px;
}
.footer{
text-align:left;
}
.footer2{
text-align:center;
}
Second time this topic has come up for me recently - is there some benefit to having a perfect Google cache page? Or is just webmasters wanting to check the page is in Google and then see a skewed layout?
is there some benefit to having a perfect Google cache page?
I'd have to ask the same question. The only time I view cache is when doing "deep review" type stuff. And then, all I'm concerned about is the "content" in the cache, I could care less what it looks like. Google has always broken many of the sites I visit with their cache insertion code. You'll get JS errors, CSS errors, HTML/XHTML errors, etc.
And I don't think there is really much you can do to override what Google is doing with the cached results. Oh wait, there is...
<meta name="googlebot" content="noarchive">
Yes, Google sticks markup before my page doctype and that alters the browser mode. But the page breaks only with IE7, so presumably IE7's quirks mode is different.
What seems to be happening is position:relative; is being interpreted as relative to the page, rather than the container div.
If there is something I can do to fix it (easily), then I would prefer to do that rather than live with unprofessional looking caches.
<meta name="googlebot" content="noarchive">
Great suggestion! But I think I must have something similar within some of my pages although I can't find it.
<meta name="googlebot" content="make this page supplementary">
Harry